调整展示问题

view/yinmeng/activity/spacTimeLuck/css/index.css

@@ -0,0 +1,290 @@
+html,
+body {
+  width: 100%;
+  background: linear-gradient(0deg, #474B6E 0%, #37304A 99%);
+}
+
+.rabbit {
+  z-index: 999;
+}
+
+.back {
+  position: fixed;
+  top: 0.93333rem;
+  left: 0.45333rem;
+  z-index: 99;
+  width: 0.82667rem;
+  height: 0.82667rem;
+}
+
+.back img {
+  width: 100%;
+  height: 100%;
+}
+
+.back p {
+  color: #fff;
+  font-size: 0.42667rem;
+  position: absolute;
+  width: 9rem;
+  left: 0;
+  top: 0;
+  height: 100%;
+  text-align: center;
+  line-height: 0.82667rem;
+}
+
+.layui-m-layershade {
+  background-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+.header {
+  width: 10rem;
+  height: 15.06667rem;
+  margin: 0 auto 0;
+  background: url(../images/header.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+}
+
+.header .giftBox {
+  width: 10rem;
+  height: 3.86667rem;
+  position: relative;
+  top: 8.94667rem;
+  left: 50%;
+  transform: translateX(-50%);
+  background: url(../images/gift.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .giftBox div {
+  position: absolute;
+  width: 1.73333rem;
+  text-align: center;
+}
+
+.header .giftBox div p {
+  color: #fff;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  margin-bottom: 0.10667rem;
+}
+
+.header .giftBox div span {
+  color: #FAF8B6;
+  font-size: 0.32rem;
+  font-weight: 300;
+  display: block;
+}
+
+.header .giftBox .div1 {
+  top: 3.50667rem;
+  left: 0.61333rem;
+}
+
+.header .giftBox .div2 {
+  top: 2.54667rem;
+  left: 2.96rem;
+}
+
+.header .giftBox .div3 {
+  top: 4rem;
+  left: 5.46667rem;
+}
+
+.header .giftBox .div4 {
+  top: 3.29333rem;
+  left: 7.86667rem;
+}
+
+.content {
+  position: relative;
+  width: 9.34667rem;
+  height: 17.72rem;
+  margin: -0.93333rem auto 0.24rem;
+  background: url(../images/content.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content .title {
+  width: 100%;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.45333rem;
+  font-weight: 400;
+  position: absolute;
+  left: 0;
+  top: 0.38667rem;
+}
+
+.content .text {
+  width: 8rem;
+  height: 1.37333rem;
+  color: #FFFFFF;
+  font-size: 0.32rem;
+  font-weight: 300;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 1.84rem;
+  line-height: 0.47rem;
+}
+
+.content .lineBox {
+  width: 9.24rem;
+  height: 2.76rem;
+  background: url(../images/lineBigBox.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  top: 3.73333rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.content .lineBox .line {
+  width: 7.88rem;
+  height: 0.68rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0.69333rem;
+  box-sizing: border-box;
+  padding: 0.10667rem 0.08rem;
+  background: url(../images/lineBox.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content .lineBox .line .line_in {
+  width: 0%;
+  height: 100%;
+  background: linear-gradient(0deg, #FFE993 0%, #EC9409 52%, #FFFC9E 98%);
+  border-radius: 0.68rem;
+  text-align: center;
+  line-height: 0.50667rem;
+  color: #F14029;
+  font-size: 0.34667rem;
+  font-weight: 400;
+}
+
+.content .lineBox .tavBox {
+  width: 95%;
+  position: absolute;
+  top: 1.61333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  box-sizing: border-box;
+  padding: 0 0.13333rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.content .lineBox .tavBox div {
+  width: 0.68rem;
+  height: 0.38667rem;
+  line-height: 0.38667rem;
+  border-radius: 0.10667rem;
+  background: linear-gradient(0deg, #6871B0 0%, #6483CA 100%);
+  color: #FFFFFF;
+  font-size: 0.28rem;
+  font-weight: 500;
+  text-align: center;
+}
+
+.content .lineBox .tavBox .active {
+  background: url(../images/tabAct.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content .updataIcon {
+  width: 0.73333rem;
+  height: 0.78667rem;
+  position: absolute;
+  right: 0.92rem;
+  top: 6.68rem;
+}
+
+.content .lottery {
+  width: 8.69333rem;
+  height: 7.98667rem;
+  position: relative;
+  top: 5rem;
+  left: 50%;
+  transform: translateX(-50%);
+  background: url(../images/contentBox.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content .lottery .title {
+  width: 100%;
+  text-align: center;
+  position: absolute;
+  top: 0.33333rem;
+  left: 0rem;
+  color: #FFFFFF;
+  font-size: 0.4rem;
+  font-weight: 500;
+}
+
+.content .lottery .user {
+  width: 2.01333rem;
+  height: 2.08rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0.84rem;
+}
+
+.content .lottery .user img {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.content .lottery .user .ts {
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+}
+
+.content .lottery .user .tx {
+  border-radius: 50%;
+  width: 1.66667rem;
+  height: 1.66667rem;
+}
+
+.content .lottery .user p {
+  width: 130%;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.28rem;
+  font-weight: 400;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 2.13333rem;
+}
+
+.content .lottery .giftList {
+  width: 6.58667rem;
+  height: 4.28rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 3.26667rem;
+}
+
+.content .dimension {
+  width: 100%;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.28rem;
+  font-weight: 400;
+  position: absolute;
+  left: 0;
+  top: 16.32rem;
+}

view/yinmeng/activity/spacTimeLuck/css/index.scss

@@ -0,0 +1,297 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: linear-gradient(0deg, #474B6E 0%, #37304A 99%);
+}
+
+.rabbit {
+    z-index: 999;
+}
+
+.back {
+    position: fixed;
+    top: px2rem(70);
+    left: px2rem(34);
+    z-index: 99;
+    width: px2rem(62);
+    height: px2rem(62);
+
+    img {
+        width: 100%;
+        height: 100%;
+    }
+
+    p {
+        color: #fff;
+        font-size: px2rem(32);
+        position: absolute;
+        width: 9rem;
+        left: 0;
+        top: 0;
+        height: 100%;
+        text-align: center;
+        line-height: px2rem(62);
+    }
+}
+
+.layui-m-layershade {
+    background-color: rgba(0, 0, 0, .4) !important;
+}
+
+.header {
+    width: px2rem(750);
+    height: px2rem(1130);
+    margin: 0 auto 0;
+    background: url(../images/header.png) no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+
+    .giftBox {
+        width: px2rem(750);
+        height: px2rem(290);
+        position: relative;
+        top: px2rem(671);
+        left: 50%;
+        transform: translateX(-50%);
+        background: url(../images/gift.png) no-repeat;
+        background-size: 100% 100%;
+
+        div {
+            position: absolute;
+            width: px2rem(130);
+            text-align: center;
+
+            p {
+                color: #fff;
+                font-size: px2rem(26);
+                font-weight: 400;
+                margin-bottom: px2rem(8);
+            }
+
+            span {
+                color: #FAF8B6;
+                font-size: px2rem(24);
+                font-weight: 300;
+                display: block;
+            }
+        }
+
+        .div1 {
+            top: px2rem(263);
+            left: px2rem(46);
+        }
+
+        .div2 {
+            top: px2rem(191);
+            left: px2rem(222);
+        }
+
+        .div3 {
+            top: px2rem(300);
+            left: px2rem(410);
+        }
+
+        .div4 {
+            top: px2rem(247);
+            left: px2rem(590);
+        }
+    }
+}
+
+.content {
+    position: relative;
+    width: px2rem(701);
+    height: px2rem(1329);
+    margin: px2rem(-70) auto px2rem(18);
+    // background-color: linear-gradient(0deg, #474B6E 0%, #37304A 99%);
+    background: url(../images/content.png) no-repeat;
+    background-size: 100% 100%;
+
+    .title {
+        width: 100%;
+        text-align: center;
+        color: #FFFFFF;
+        font-size: px2rem(34);
+        font-weight: 400;
+        position: absolute;
+        left: 0;
+        top: px2rem(29);
+    }
+
+    .text {
+        width: px2rem(600);
+        height: px2rem(103);
+        color: #FFFFFF;
+        font-size: px2rem(24);
+        font-weight: 300;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(138);
+        line-height: 0.47rem;
+    }
+
+    .lineBox {
+        width: px2rem(693);
+        height: px2rem(207);
+        background: url(../images/lineBigBox.png) no-repeat;
+        background-size: 100% 100%;
+        position: relative;
+        top: px2rem(280);
+        left: 50%;
+        transform: translateX(-50%);
+
+        .line {
+            width: px2rem(591);
+            height: px2rem(51);
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: px2rem(52);
+            box-sizing: border-box;
+            padding: px2rem(8) px2rem(6);
+            background: url(../images/lineBox.png) no-repeat;
+            background-size: 100% 100%;
+
+            .line_in {
+                width: 0%;
+                height: 100%;
+                background: linear-gradient(0deg, #FFE993 0%, #EC9409 52%, #FFFC9E 98%);
+                border-radius: px2rem(51);
+                text-align: center;
+                line-height: px2rem(38);
+                color: #F14029;
+                font-size: px2rem(26);
+                font-weight: 400;
+            }
+        }
+
+        .tavBox {
+            width: 95%;
+            position: absolute;
+            top: px2rem(121);
+            left: 50%;
+            transform: translateX(-50%);
+            box-sizing: border-box;
+            padding: 0 px2rem(10);
+            display: flex;
+            justify-content: space-between;
+
+            div {
+                width: px2rem(51);
+                // padding: 0 px2rem(10);
+                height: px2rem(29);
+                line-height: px2rem(29);
+                border-radius: px2rem(8);
+                background: linear-gradient(0deg, #6871B0 0%, #6483CA 100%);
+                color: #FFFFFF;
+                font-size: px2rem(21);
+                font-weight: 500;
+                text-align: center;
+            }
+
+            .active {
+                background: url(../images/tabAct.png) no-repeat;
+                background-size: 100% 100%;
+            }
+        }
+    }
+
+    .updataIcon {
+        width: px2rem(55);
+        height: px2rem(59);
+        position: absolute;
+        right: px2rem(69);
+        top: px2rem(501);
+    }
+
+    .lottery {
+        width: px2rem(652);
+        height: px2rem(599);
+        position: relative;
+        top: 5rem;
+        left: 50%;
+        transform: translateX(-50%);
+        background: url(../images/contentBox.png) no-repeat;
+        background-size: 100% 100%;
+
+        .title {
+            width: 100%;
+            text-align: center;
+            position: absolute;
+            top: px2rem(25);
+            left: px2rem(0);
+            color: #FFFFFF;
+            font-size: px2rem(30);
+            font-weight: 500;
+        }
+
+        .user {
+            width: px2rem(151);
+            height: px2rem(156);
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: px2rem(63);
+
+            img {
+                position: absolute;
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%, -50%);
+            }
+
+            .ts {
+                width: 100%;
+                height: 100%;
+                z-index: 2;
+            }
+
+            .tx {
+                border-radius: 50%;
+                width: px2rem(125);
+                height: px2rem(125);
+            }
+
+            p {
+                width: 130%;
+                text-align: center;
+                color: #FFFFFF;
+                font-size: px2rem(21);
+                font-weight: 400;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                top: px2rem(160);
+            }
+        }
+
+        .giftList {
+            width: px2rem(494);
+            height: px2rem(321);
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: px2rem(245);
+        }
+    }
+
+    .dimension {
+        width: 100%;
+        text-align: center;
+        color: #FFFFFF;
+        font-size: px2rem(21);
+        font-weight: 400;
+        position: absolute;
+        left: 0;
+        top: px2rem(1224);
+    }
+
+}

view/yinmeng/activity/spacTimeLuck/index.html

@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>时空幸运儿</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 顶部返回 -->
+    <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div>
+    <!-- 头部 -->
+    <div class="header">
+        <!-- 礼物展示 -->
+        <div src="" alt="" class="giftBox">
+            <div class="div1">
+                <p>冬雪心愿</p>
+                <span>1314钻</span>
+            </div>
+            <div class="div2">
+                <p>蝶恋花</p>
+                <span>1314钻</span>
+            </div>
+            <div class="div3">
+                <p>夜莺与玫瑰</p>
+                <span>1314钻</span>
+            </div>
+            <div class="div4">
+                <p>玫瑰时钟</p>
+                <span>1314钻</span>
+            </div>
+        </div>
+    </div>
+    <!-- 内容 -->
+    <div class="content">
+        <div class="title">活动规则</div>
+        <div class="text">活动期间全民助力, 每送出一个上新礼物下方进度条+1, 第<b>18/88/128/288/398/488/598/688/788/888</b>名用户成为幸运儿可获得幸运奖励</div>
+        <div class="lineBox">
+            <div class="line">
+                <div class="line_in"></div>
+            </div>
+            <div class="tavBox">
+                <!-- <div class="active">18</div>
+                <div>38</div>
+                <div>88</div>
+                <div>128</div>
+                <div>208</div>
+                <div>288</div>
+                <div>398</div>
+                <div>488</div>
+                <div>598</div>
+                <div>688</div>
+                <div>788</div>
+                <div>888</div> -->
+            </div>
+        </div>
+        <img src="./images/updataIcon.png" alt="" class="updataIcon">
+        <div class="lottery">
+            <div class="title">幸运儿</div>
+            <div class="user">
+                <img src="./images/ts.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <p></p>
+            </div>
+            <img src="./images/18.png" alt="" class="giftList">
+        </div>
+        <div class="dimension">本活动最終解释权归音萌所有，本活动以及奖励与苹果公司无关。</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="./js/wow.js"></script>
+<script src="./js/index.js"></script>

view/yinmeng/activity/spacTimeLuck/js/index.js

@@ -0,0 +1,134 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 页面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 顶部返回事件
+        $('.back').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        getConfig();
+    }, 100)
+})
+var obj = {};
+// 获取配置接口
+function getConfig () {
+    $('.content .lineBox .tavBox div').remove();
+    showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/2023LuckyProcessBar/getConfig',
+        success (res) {
+            if (res.code === 200) {
+                // 处理进度
+                $('.content .lineBox .line .line_in').text(`${res.data.cur}/${res.data.max}`);
+                $(`.content .lineBox .line .line_in`).css({ width: `${(res.data.cur / res.data.max) * 100 >= 100 ? 100 : (res.data.cur / res.data.max) * 100}%` });
+                obj = res.data.stageMap;
+                var cur = res.data.cur;
+                var str = '';
+                var text = '';
+                var arr = [];
+                var curstage;
+                // 渲染切换tab
+                for (var key in obj) {
+                    if (obj.hasOwnProperty(key)) {
+                        str += `
+                            <div class="key${obj[key].stage}" key=${obj[key].stage}>${obj[key].stage}</div>
+                        `
+                        text += `${obj[key].stage}/`
+                        arr.push(obj[key]);
+                    }
+                }
+                $('.content .lineBox .tavBox').append(str);
+                $('.content .text b').text(text);
+                // 处理当前阶段
+                arr.forEach((val, i) => {
+                    if (val.luckyUser) {//false
+                        // curstage = val.stage;
+                        // $('.content .lottery .user .tx').attr('src', val.luckyUser.avatar)
+                        // $('.content .lottery .user p').text(val.luckyUser.nick);
+                        if (i == arr.length - 1) {
+                            curstage = arr[arr.length - 1].stage;
+                            $('.content .lottery .user .tx').attr('src', val.luckyUser.avatar)
+                            $('.content .lottery .user p').text(val.luckyUser.nick);
+                        } else {
+                            curstage = arr[i + 1].stage;
+                            $('.content .lottery .user .tx').attr('src', `./images/logo.png`);
+                            $('.content .lottery .user p').text('虚位以待');
+                        }
+                    } else if (i == 0) {
+                        curstage = arr[0].stage;
+                        $('.content .lottery .user .tx').attr('src', `./images/logo.png`);
+                        $('.content .lottery .user p').text('虚位以待');
+                    }
+                });
+                // console.log(curstage);
+                $(`.content .lineBox .tavBox .key${curstage}`).addClass('active').siblings().removeClass('active');
+                $('.content .lottery .giftList').attr('src', `./images/${curstage}.png`)
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 刷新按钮
+$('.content .updataIcon').click(function () {
+    getConfig();
+})
+// tab切换
+$('.content').on('click', ' .lineBox .tavBox div', function () {
+    var key = $(this).attr('key')
+    $(this).addClass('active').siblings().removeClass('active');
+    $('.content .lottery .giftList').attr('src', `./images/${key}.png`)
+    // console.log(obj[key]);
+    if (obj[key].luckyUser) {
+        $('.content .lottery .user .tx').attr('src', obj[key].luckyUser.avatar);
+        $('.content .lottery .user p').text(obj[key].luckyUser.nick);
+    } else {
+        $('.content .lottery .user .tx').attr('src', `./images/logo.png`);
+        $('.content .lottery .user p').text('虚位以待');
+    }
+})

view/yinmeng/activity/spacTimeLuck/js/wow.js

@@ -0,0 +1,46 @@
+var baba = document.querySelector('body');
+baba.addEventListener('click', function (e) {
+    // $('body,html').css({ "width": "100%", "position": "relative", "overflow": "hidden" });
+    tianJia(e);
+})
+
+var erZi = [];
+function tianJia (e) {
+    var sunZi = document.createElement('div');
+    sunZi.className = 'rabbit';
+    // sunZi.innerHTML = '<i class="iconfont icon-tuzi"></i>';
+    sunZi.innerHTML = '<img src="./images/icon.png" alt="">';
+    baba.appendChild(sunZi);
+    erZi.push({
+        el: sunZi,
+        top: e.pageY - 30,
+        left: e.pageX - 20,
+        opacity: 1,
+        scale: 1,
+        color: `rgb(${255 * Math.random()},${255 * Math.random()},${255 * Math.random()})`
+    });
+    move();
+};
+function move () {
+    for (var i = 0; i < erZi.length; i++) {
+        if (erZi[i].opacity <= 0) {
+            baba.removeChild(erZi[i].el);
+            erZi.splice(i, 1);
+            return;
+        }
+        erZi[i].top--;
+        erZi[i].opacity = erZi[i].opacity - 0.04;
+        // erZi[i].scale = erZi[i].scale + 0.0001;
+        erZi[i].el.style.cssText = `
+            top: ${erZi[i].top}px;
+            left: ${erZi[i].left}px;
+            color: ${erZi[i].color};
+            opacity: ${erZi[i].opacity};
+            transform: scale(${erZi[i].scale});
+            position: absolute;
+            `
+
+    }
+    window.requestAnimationFrame(move);
+    // $('body,html').css({ "width": "100%", "position": "relative", "overflow": "auto" });
+}

view/yinmeng/modules/hourRank/css/index.css

@@ -0,0 +1,550 @@
+html,
+body {
+  width: 100%;
+  background: #0B1836;
+  overflow: hidden;
+}
+
+html::-webkit-scrollbar,
+body::-webkit-scrollbar {
+  display: none;
+}
+
+.layui-m-layershade {
+  background-color: transparent !important;
+}
+
+.layui-m-layer2 .layui-m-layerchild {
+  width: 3rem !important;
+  height: 3rem !important;
+  border: none !important;
+  box-shadow: none !important;
+  color: #fff !important;
+  background: rgba(0, 0, 0, 0.6) !important;
+}
+
+.layui-m-layer2 .layui-m-layercont {
+  text-align: center !important;
+  padding: 0 !important;
+  line-height: 0 !important;
+  margin-top: 0.8rem !important;
+}
+
+.back {
+  position: fixed;
+  top: 0.26667rem;
+  left: 0.32rem;
+  z-index: 99;
+  width: 0.82667rem;
+  height: 0.82667rem;
+}
+
+.back img {
+  width: 100%;
+  height: 100%;
+}
+
+.back p {
+  color: #fff;
+  font-size: 0.42667rem;
+  position: absolute;
+  width: 9rem;
+  left: 0;
+  top: 0;
+  height: 100%;
+  text-align: center;
+  line-height: 0.82667rem;
+}
+
+.largestBox {
+  width: 10rem;
+  min-height: 15.38667rem;
+  background: url(../images/bg.png) no-repeat;
+  background-size: 10rem 15.38667rem;
+  margin: 0 auto;
+  position: relative;
+  box-sizing: border-box;
+  padding: 1.17333rem 0 0 0;
+}
+
+.largestBox .title {
+  width: 7.06667rem;
+  height: 1.14667rem;
+  position: absolute;
+  top: -0.12rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.largestBox .lastHour {
+  width: 9.14667rem;
+  margin: 0rem auto 0.42667rem;
+}
+
+.largestBox .lastHour .text {
+  width: 100%;
+  color: #FFDA24;
+  font-size: 0.37333rem;
+  margin-bottom: 0.24rem;
+  font-weight: 600;
+}
+
+.largestBox .box {
+  width: 9.14667rem;
+  height: 2.34667rem;
+  background: url(../images/lastHour.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+}
+
+.largestBox .box .txbox {
+  width: 2.02667rem;
+  height: 2.45333rem;
+  background: url(../images/hourTs.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  margin-right: 0.24rem;
+  float: left;
+}
+
+.largestBox .box .txbox .hourTs {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.largestBox .box .txbox .tx {
+  width: 1.44rem;
+  height: 1.44rem;
+  border-radius: 50%;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0.4rem;
+}
+
+.largestBox .box .userInfo {
+  float: left;
+  width: 3.73333rem;
+  position: relative;
+  height: 100%;
+}
+
+.largestBox .box .userInfo p {
+  width: 100%;
+  margin-top: 0.37333rem;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.largestBox .box .userInfo .mvp {
+  width: 0.74667rem;
+  height: 0.74667rem;
+  border-radius: 50%;
+  border: 0.02667rem solid #FFDA24;
+  position: absolute;
+  top: 1.06667rem;
+}
+
+.largestBox .box .userInfo .mvp .mvpTx {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  border-radius: 50%;
+}
+
+.largestBox .box .userInfo .mvp span {
+  width: 0.90667rem;
+  height: 0.29333rem;
+  line-height: 0.29333rem;
+  border-radius: 0.29333rem;
+  position: absolute;
+  top: 0.61333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.18667rem;
+  background: linear-gradient(180deg, #FFDA24 0%, #FF8615 100%);
+  padding: 0 0.02667rem;
+}
+
+.largestBox .box .userInfo .member {
+  width: 2.29333rem;
+  height: 0.69333rem;
+  border-radius: 0.69333rem;
+  position: absolute;
+  left: 1.2rem;
+  top: 1.17333rem;
+  background: rgba(255, 255, 255, 0.4);
+}
+
+.largestBox .box .userInfo .member img {
+  position: absolute;
+  width: 0.48rem;
+  height: 0.48rem;
+  border: 0.02667rem solid #FFDA24;
+  border-radius: 50%;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.largestBox .box .userInfo .member .memberTx1 {
+  left: 0.16rem;
+}
+
+.largestBox .box .userInfo .member .memberTx2 {
+  left: 0.53333rem;
+  z-index: 2;
+}
+
+.largestBox .box .userInfo .member .memberTx3 {
+  left: 0.90667rem;
+  z-index: 3;
+}
+
+.largestBox .box .userInfo .member .memberTx4 {
+  left: 1.28rem;
+  z-index: 4;
+}
+
+.largestBox .box .userInfo .member .memberTx5 {
+  left: 1.65333rem;
+  z-index: 5;
+}
+
+.largestBox .box .score {
+  float: right;
+  height: 100%;
+  line-height: 2.34667rem;
+}
+
+.largestBox .box .score img {
+  display: inline-block;
+  width: 0.37333rem;
+  height: 0.37333rem;
+  vertical-align: middle;
+}
+
+.largestBox .box .score span {
+  color: #FFDA24;
+  font-weight: 600;
+  font-size: 0.42667rem;
+  vertical-align: middle;
+}
+
+.largestBox .hourList {
+  width: 100%;
+}
+
+.largestBox .hourList .top {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  padding: 0 0.53333rem;
+  margin-bottom: 0.26667rem;
+}
+
+.largestBox .hourList .top .sp {
+  color: #FFDA24;
+  font-size: 0.37333rem;
+  font-weight: 600;
+}
+
+.largestBox .hourList .top span {
+  color: #B1B5BD;
+  font-size: 0.32rem;
+  font-weight: 600;
+}
+
+.largestBox .hourList .top span b {
+  color: #FFDA24;
+}
+
+.largestBox .hourList ul {
+  width: 100%;
+  height: 7rem;
+  overflow-y: scroll;
+  box-sizing: border-box;
+  padding-bottom: 0.66667rem;
+}
+
+.largestBox .hourList ul::-webkit-scrollbar {
+  display: none;
+}
+
+.largestBox .hourList ul li {
+  width: 100%;
+  height: 2.13333rem;
+  backdrop-filter: blur(0px);
+  box-sizing: border-box;
+  padding: 0 0.53333rem;
+  background: RGBA(11, 24, 57, 1);
+}
+
+.largestBox .hourList ul li .num {
+  width: 0.64rem;
+  height: 0.64rem;
+  text-align: center;
+  color: #E6ECF5;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  float: left;
+  margin-top: 0.74667rem;
+  margin-right: 0.42667rem;
+  float: left;
+}
+
+.largestBox .hourList ul li .num1 {
+  background: url(../images/no1.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.largestBox .hourList ul li .num2 {
+  background: url(../images/no2.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.largestBox .hourList ul li .num3 {
+  background: url(../images/no3.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.largestBox .hourList ul li .tx {
+  width: 1.28rem;
+  height: 1.28rem;
+  border-radius: 50%;
+  margin-top: 0.42667rem;
+  margin-right: 0.32rem;
+  display: block;
+  float: left;
+}
+
+.largestBox .hourList ul li .userInfo {
+  float: left;
+  width: 3.73333rem;
+  position: relative;
+  height: 100%;
+}
+
+.largestBox .hourList ul li .userInfo p {
+  width: 100%;
+  margin-top: 0.26667rem;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.largestBox .hourList ul li .userInfo .mvp {
+  width: 0.74667rem;
+  height: 0.74667rem;
+  border-radius: 50%;
+  border: 0.02667rem solid #FFDA24;
+  position: absolute;
+  top: 0.96rem;
+}
+
+.largestBox .hourList ul li .userInfo .mvp .mvpTx {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  border-radius: 50%;
+}
+
+.largestBox .hourList ul li .userInfo .mvp span {
+  width: 0.90667rem;
+  height: 0.29333rem;
+  line-height: 0.29333rem;
+  border-radius: 0.29333rem;
+  position: absolute;
+  top: 0.61333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.18667rem;
+  background: linear-gradient(180deg, #FFDA24 0%, #FF8615 100%);
+  padding: 0 0.02667rem;
+}
+
+.largestBox .hourList ul li .userInfo .member {
+  width: 2.29333rem;
+  height: 0.69333rem;
+  border-radius: 0.69333rem;
+  position: absolute;
+  left: 1.2rem;
+  top: 1.06667rem;
+  background: rgba(255, 255, 255, 0.4);
+}
+
+.largestBox .hourList ul li .userInfo .member img {
+  position: absolute;
+  width: 0.48rem;
+  height: 0.48rem;
+  border: 0.02667rem solid #FFDA24;
+  border-radius: 50%;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.largestBox .hourList ul li .userInfo .member .memberTx1 {
+  left: 0.16rem;
+}
+
+.largestBox .hourList ul li .userInfo .member .memberTx2 {
+  left: 0.53333rem;
+  z-index: 2;
+}
+
+.largestBox .hourList ul li .userInfo .member .memberTx3 {
+  left: 0.90667rem;
+  z-index: 3;
+}
+
+.largestBox .hourList ul li .userInfo .member .memberTx4 {
+  left: 1.28rem;
+  z-index: 4;
+}
+
+.largestBox .hourList ul li .userInfo .member .memberTx5 {
+  left: 1.65333rem;
+  z-index: 5;
+}
+
+.largestBox .hourList ul li .score {
+  float: right;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  margin-top: 0.58667rem;
+  text-align: right;
+}
+
+.largestBox .hourList ul li .score p {
+  margin-bottom: 0.13333rem;
+}
+
+.largestBox .hourList ul li .score span {
+  color: #B1B5BD;
+  font-size: 0.29333rem;
+  font-weight: 400;
+  display: block;
+}
+
+.largestBox .hourList ul li .first {
+  position: absolute;
+  width: 0.85333rem;
+  height: 0.37333rem;
+  right: 0.53333rem;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.largestBox .hourList ul .li1 {
+  background: linear-gradient(270deg, rgba(255, 204, 0, 0) 0%, rgba(255, 199, 44, 0.35) 100%);
+}
+
+.largestBox .hourList ul .li2 {
+  background: linear-gradient(270deg, rgba(109, 139, 209, 0) 0%, rgba(135, 158, 204, 0.35) 100%);
+}
+
+.largestBox .hourList ul .li3 {
+  background: linear-gradient(270deg, rgba(163, 102, 46, 0) 0%, rgba(198, 135, 81, 0.35) 100%);
+}
+
+.my {
+  width: 100%;
+  height: 2.05333rem;
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  background: url(../images/my.png) no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 2.13333rem;
+  box-sizing: border-box;
+  padding: 0 0.53333rem;
+}
+
+.my .num {
+  height: 0.64rem;
+  text-align: center;
+  color: #E6ECF5;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  float: left;
+  margin-top: 0.74667rem;
+  margin-right: 0.42667rem;
+  float: left;
+}
+
+.my .tx {
+  width: 1.28rem;
+  height: 1.28rem;
+  border-radius: 50%;
+  margin-top: 0.42667rem;
+  margin-right: 0.32rem;
+  display: block;
+  float: left;
+}
+
+.my .score {
+  float: left;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  margin-top: 0.58667rem;
+  width: 3.73333rem;
+}
+
+.my .score p {
+  width: 100%;
+  margin-bottom: 0.13333rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.my .score span {
+  color: #B1B5BD;
+  font-size: 0.29333rem;
+  font-weight: 400;
+  display: block;
+}
+
+.my .score span b {
+  color: #E6ECF5;
+}
+
+.my .but {
+  width: 1.76rem;
+  height: 0.74667rem;
+  line-height: 0.74667rem;
+  margin-top: 0.56rem;
+  text-align: center;
+  color: #FFDA24;
+  font-size: 0.32rem;
+  font-weight: 500;
+  background: url(../images/myBut.png) no-repeat;
+  background-size: 100% 100%;
+  float: right;
+}

view/yinmeng/modules/hourRank/css/index.scss

@@ -0,0 +1,560 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    // background: linear-gradient(0deg, #0F2E69 0%, #0B1836 99%);
+    background: #0B1836;
+    overflow: hidden;
+
+    &::-webkit-scrollbar {
+        display: none;
+    }
+}
+
+.layui-m-layershade {
+    background-color: rgba(0, 0, 0, .0) !important;
+}
+
+.layui-m-layer2 .layui-m-layerchild {
+    width: 3rem !important;
+    height: 3rem !important;
+    border: none !important;
+    box-shadow: none !important;
+    color: #fff !important;
+    background: rgba(0, 0, 0, .6) !important;
+}
+
+.layui-m-layer2 .layui-m-layercont {
+    text-align: center !important;
+    padding: 0 !important;
+    line-height: 0 !important;
+    margin-top: 0.8rem !important;
+}
+
+.back {
+    position: fixed;
+    top: px2rem(20);
+    left: px2rem(24);
+    z-index: 99;
+    width: px2rem(62);
+    height: px2rem(62);
+
+    img {
+        width: 100%;
+        height: 100%;
+    }
+
+    p {
+        color: #fff;
+        font-size: px2rem(32);
+        position: absolute;
+        width: 9rem;
+        left: 0;
+        top: 0;
+        height: 100%;
+        text-align: center;
+        line-height: px2rem(62);
+    }
+}
+
+.largestBox {
+    width: px2rem(750);
+    min-height: px2rem(1154);
+    background: url(../images/bg.png) no-repeat;
+    background-size: px2rem(750) px2rem(1154);
+    margin: 0 auto;
+    position: relative;
+    box-sizing: border-box;
+    padding: px2rem(88) 0 0 0;
+
+    .title {
+        width: px2rem(530);
+        height: px2rem(86);
+        position: absolute;
+        top: px2rem(-9);
+        left: 50%;
+        transform: translateX(-50%);
+    }
+
+    .lastHour {
+        width: px2rem(686);
+        margin: px2rem(0) auto px2rem(32);
+
+        .text {
+            width: 100%;
+            color: #FFDA24;
+            font-size: px2rem(28);
+            margin-bottom: px2rem(18);
+            font-weight: 600;
+        }
+    }
+
+    .box {
+        width: px2rem(686);
+        height: px2rem(176);
+        background: url(../images/lastHour.png) no-repeat;
+        background-size: 100% 100%;
+        position: relative;
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+
+        .txbox {
+            width: px2rem(152);
+            height: px2rem(184);
+            background: url(../images/hourTs.png) no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+            margin-right: px2rem(18);
+            float: left;
+
+            .hourTs {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+                left: 0;
+                top: 0;
+                z-index: 2;
+            }
+
+            .tx {
+                width: px2rem(108);
+                height: px2rem(108);
+                border-radius: 50%;
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                top: px2rem(30);
+            }
+        }
+
+        .userInfo {
+            float: left;
+            width: px2rem(280);
+            position: relative;
+            height: 100%;
+
+            p {
+                width: 100%;
+                margin-top: px2rem(28);
+                color: #E6ECF5;
+                font-size: px2rem(28);
+                font-weight: 500;
+                // 超出省略号
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
+
+            .mvp {
+                width: px2rem(56);
+                height: px2rem(56);
+                border-radius: 50%;
+                border: px2rem(2) solid #FFDA24;
+                position: absolute;
+                top: px2rem(80);
+
+                .mvpTx {
+                    position: absolute;
+                    width: 100%;
+                    height: 100%;
+                    left: 0;
+                    top: 0;
+                    border-radius: 50%;
+                }
+
+                span {
+                    width: px2rem(68);
+                    height: px2rem(22);
+                    line-height: px2rem(22);
+                    border-radius: px2rem(22);
+                    position: absolute;
+                    top: px2rem(46);
+                    left: 50%;
+                    transform: translateX(-50%);
+                    text-align: center;
+                    color: #FFFFFF;
+                    font-size: px2rem(14);
+                    background: linear-gradient(180deg, #FFDA24 0%, #FF8615 100%);
+                    padding: 0 px2rem(2);
+                }
+            }
+
+            .member {
+                width: px2rem(172);
+                height: px2rem(52);
+                border-radius: px2rem(52);
+                position: absolute;
+                left: px2rem(90);
+                top: px2rem(88);
+                background: rgba(255, 255, 255, 0.4);
+
+                img {
+                    position: absolute;
+                    width: px2rem(36);
+                    height: px2rem(36);
+                    border: px2rem(2) solid #FFDA24;
+                    border-radius: 50%;
+                    position: absolute;
+                    top: 50%;
+                    transform: translateY(-50%);
+                }
+
+                .memberTx1 {
+                    left: px2rem(12);
+                }
+
+                .memberTx2 {
+                    left: px2rem(40);
+                    z-index: 2;
+                }
+
+                .memberTx3 {
+                    left: px2rem(68);
+                    z-index: 3;
+                }
+
+                .memberTx4 {
+                    left: px2rem(96);
+                    z-index: 4;
+                }
+
+                .memberTx5 {
+                    left: px2rem(124);
+                    z-index: 5;
+                }
+            }
+
+
+        }
+
+        .score {
+            float: right;
+            height: 100%;
+            line-height: px2rem(176);
+
+            img {
+                display: inline-block;
+                width: px2rem(28);
+                height: px2rem(28);
+                vertical-align: middle;
+            }
+
+            span {
+                color: #FFDA24;
+                font-weight: 600;
+                font-size: px2rem(32);
+                vertical-align: middle;
+            }
+        }
+    }
+
+    .hourList {
+        width: 100%;
+
+        .top {
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            box-sizing: border-box;
+            padding: 0 px2rem(40);
+            margin-bottom: px2rem(20);
+
+            .sp {
+                color: #FFDA24;
+                font-size: px2rem(28);
+                font-weight: 600;
+            }
+
+            span {
+                color: #B1B5BD;
+                font-size: px2rem(24);
+                font-weight: 600;
+
+                b {
+                    color: #FFDA24;
+                }
+            }
+        }
+
+        ul {
+            width: 100%;
+            height: 7rem;
+            overflow-y: scroll;
+            box-sizing: border-box;
+            padding-bottom: px2rem(50);
+
+            &::-webkit-scrollbar {
+                display: none;
+            }
+
+            li {
+                width: 100%;
+                height: px2rem(160);
+                backdrop-filter: blur(0px);
+                box-sizing: border-box;
+                padding: 0 px2rem(40);
+                background: RGBA(11, 24, 57, 1);
+
+                .num {
+                    width: px2rem(48);
+                    height: px2rem(48);
+                    text-align: center;
+                    color: #E6ECF5;
+                    font-size: px2rem(32);
+                    font-weight: 500;
+                    float: left;
+                    margin-top: px2rem(56);
+                    margin-right: px2rem(32);
+                    float: left;
+                }
+
+                .num1 {
+                    background: url(../images/no1.png) no-repeat;
+                    background-size: 100% 100%;
+                }
+
+                .num2 {
+                    background: url(../images/no2.png) no-repeat;
+                    background-size: 100% 100%;
+                }
+
+                .num3 {
+                    background: url(../images/no3.png) no-repeat;
+                    background-size: 100% 100%;
+                }
+
+                .tx {
+                    width: px2rem(96);
+                    height: px2rem(96);
+                    border-radius: 50%;
+                    margin-top: px2rem(32);
+                    margin-right: px2rem(24);
+                    display: block;
+                    float: left;
+                }
+
+                .userInfo {
+                    float: left;
+                    width: px2rem(280);
+                    position: relative;
+                    height: 100%;
+
+                    p {
+                        width: 100%;
+                        margin-top: px2rem(20);
+                        color: #E6ECF5;
+                        font-size: px2rem(28);
+                        font-weight: 500;
+                        // 超出省略号
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+                    }
+
+                    .mvp {
+                        width: px2rem(56);
+                        height: px2rem(56);
+                        border-radius: 50%;
+                        border: px2rem(2) solid #FFDA24;
+                        position: absolute;
+                        top: px2rem(72);
+
+                        .mvpTx {
+                            position: absolute;
+                            width: 100%;
+                            height: 100%;
+                            left: 0;
+                            top: 0;
+                            border-radius: 50%;
+                        }
+
+                        span {
+                            width: px2rem(68);
+                            height: px2rem(22);
+                            line-height: px2rem(22);
+                            border-radius: px2rem(22);
+                            position: absolute;
+                            top: px2rem(46);
+                            left: 50%;
+                            transform: translateX(-50%);
+                            text-align: center;
+                            color: #FFFFFF;
+                            font-size: px2rem(14);
+                            background: linear-gradient(180deg, #FFDA24 0%, #FF8615 100%);
+                            padding: 0 px2rem(2);
+                        }
+                    }
+
+                    .member {
+                        width: px2rem(172);
+                        height: px2rem(52);
+                        border-radius: px2rem(52);
+                        position: absolute;
+                        left: px2rem(90);
+                        top: px2rem(80);
+                        background: rgba(255, 255, 255, 0.4);
+
+                        img {
+                            position: absolute;
+                            width: px2rem(36);
+                            height: px2rem(36);
+                            border: px2rem(2) solid #FFDA24;
+                            border-radius: 50%;
+                            position: absolute;
+                            top: 50%;
+                            transform: translateY(-50%);
+                        }
+
+                        .memberTx1 {
+                            left: px2rem(12);
+                        }
+
+                        .memberTx2 {
+                            left: px2rem(40);
+                            z-index: 2;
+                        }
+
+                        .memberTx3 {
+                            left: px2rem(68);
+                            z-index: 3;
+                        }
+
+                        .memberTx4 {
+                            left: px2rem(96);
+                            z-index: 4;
+                        }
+
+                        .memberTx5 {
+                            left: px2rem(124);
+                            z-index: 5;
+                        }
+                    }
+                }
+
+                .score {
+                    float: right;
+                    color: #E6ECF5;
+                    font-size: px2rem(28);
+                    font-weight: 600;
+                    margin-top: px2rem(44);
+                    text-align: right;
+
+                    p {
+                        margin-bottom: px2rem(10);
+                    }
+
+                    span {
+                        color: #B1B5BD;
+                        font-size: px2rem(22);
+                        font-weight: 400;
+                        display: block;
+                    }
+                }
+
+                .first {
+                    position: absolute;
+                    width: px2rem(64);
+                    height: px2rem(28);
+                    right: px2rem(40);
+                    top: 50%;
+                    transform: translateY(-50%);
+                }
+            }
+
+            .li1 {
+                background: linear-gradient(270deg, rgba(255, 204, 0, 0) 0%, rgba(255, 199, 44, 0.35) 100%);
+            }
+
+            .li2 {
+                background: linear-gradient(270deg, rgba(109, 139, 209, 0) 0%, rgba(135, 158, 204, 0.35) 100%);
+            }
+
+            .li3 {
+                background: linear-gradient(270deg, rgba(163, 102, 46, 0) 0%, rgba(198, 135, 81, 0.35) 100%);
+            }
+        }
+    }
+}
+
+.my {
+    width: 100%;
+    height: px2rem(154);
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    background: url(../images/my.png) no-repeat;
+    background-size: 100% 100%;
+    width: 100%;
+    height: px2rem(160);
+    box-sizing: border-box;
+    padding: 0 px2rem(40);
+
+    .num {
+        // width: px2rem(48);
+        height: px2rem(48);
+        text-align: center;
+        color: #E6ECF5;
+        font-size: px2rem(32);
+        font-weight: 500;
+        float: left;
+        margin-top: px2rem(56);
+        margin-right: px2rem(32);
+        float: left;
+    }
+
+    .tx {
+        width: px2rem(96);
+        height: px2rem(96);
+        border-radius: 50%;
+        margin-top: px2rem(32);
+        margin-right: px2rem(24);
+        display: block;
+        float: left;
+    }
+
+    .score {
+        float: left;
+        color: #E6ECF5;
+        font-size: px2rem(28);
+        font-weight: 600;
+        margin-top: px2rem(44);
+        width: px2rem(280);
+
+        p {
+            width: 100%;
+            margin-bottom: px2rem(10);
+            // 超出省略号
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        span {
+            color: #B1B5BD;
+            font-size: px2rem(22);
+            font-weight: 400;
+            display: block;
+
+            b {
+                color: #E6ECF5;
+            }
+        }
+    }
+
+    .but {
+        width: px2rem(132);
+        height: px2rem(56);
+        line-height: px2rem(56);
+        margin-top: px2rem(42);
+        text-align: center;
+        color: #FFDA24;
+        font-size: px2rem(24);
+        font-weight: 500;
+        background: url(../images/myBut.png) no-repeat;
+        background-size: 100% 100%;
+        float: right;
+    }
+}

view/yinmeng/modules/hourRank/index.html

@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>小时榜</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 顶部返回 -->
+    <!-- <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div> -->
+    <!-- 最外层容器 -->
+    <div class="largestBox">
+        <!-- 标题 -->
+        <img src="./images/title.png" alt="" class="title">
+        <!-- 上期小时榜 -->
+        <div class="lastHour">
+            <div class="text">上小时 top1</div>
+            <div class="box">
+                <div class="txbox">
+                    <img src="./images/hourTs.png" alt="" class="hourTs">
+                    <img src="./images/logo.png" alt="" class="tx">
+                </div>
+                <div class="userInfo">
+                    <p></p>
+                    <div class="mvp">
+                        <img src="./images/logo.png" alt="" class="mvpTx">
+                        <span>最佳助力</span>
+                    </div>
+                    <div class="member">
+                        <img src="./images/logo.png" alt="" class="memberTx memberTx1">
+                        <img src="./images/logo.png" alt="" class="memberTx memberTx2">
+                        <img src="./images/logo.png" alt="" class="memberTx memberTx3">
+                        <img src="./images/logo.png" alt="" class="memberTx memberTx4">
+                        <img src="./images/logo.png" alt="" class="memberTx memberTx5">
+                    </div>
+                </div>
+
+                <div class="score">
+                    <img src="./images/hot.png" alt="" class="hot">
+                    <span></span>
+                </div>
+            </div>
+        </div>
+        <!-- 小时榜 -->
+        <div class="hourList">
+            <div class="top">
+                <span class="sp">
+                    <!-- 20点 小时榜 -->
+                </span>
+                <span class="sp2">
+                    <!-- 剩余<b>10</b>分<b>10</b>秒 -->
+                </span>
+            </div>
+            <ul>
+                <!-- <li class="li1">
+                    <div class="num num1"></div>
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div class="userInfo">
+                        <p>我的名字很长我的名字很长我的名字很长我的名字很长</p>
+                        <div class="mvp">
+                            <img src="./images/logo.png" alt="" class="mvpTx">
+                            <span>最佳助力</span>
+                        </div>
+                        <div class="member">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx1">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx2">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx3">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx4">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx5">
+                        </div>
+                    </div>
+                    <div class="score">
+                        <p>1000</p>
+                        <span>距上一名</span>
+                    </div>
+                    <img src="./images/first.png" alt="" class="first">
+                </li>
+                <li class="li2">
+                    <div class="num num2"></div>
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div class="userInfo">
+                        <p>我的名字很长我的名字很长我的名字很长我的名字很长</p>
+                        <div class="mvp">
+                            <img src="./images/logo.png" alt="" class="mvpTx">
+                            <span>最佳助力</span>
+                        </div>
+                        <div class="member">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx1">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx2">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx3">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx4">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx5">
+                        </div>
+                    </div>
+                    <div class="score">
+                        <p>1000</p>
+                        <span>距上一名</span>
+                    </div>
+                </li>
+                <li class="li3">
+                    <div class="num num3"></div>
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div class="userInfo">
+                        <p>我的名字很长我的名字很长我的名字很长我的名字很长</p>
+                        <div class="mvp">
+                            <img src="./images/logo.png" alt="" class="mvpTx">
+                            <span>最佳助力</span>
+                        </div>
+                        <div class="member">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx1">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx2">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx3">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx4">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx5">
+                        </div>
+                    </div>
+                    <div class="score">
+                        <p>1000</p>
+                        <span>距上一名</span>
+                    </div>
+                </li>
+                <li>
+                    <div class="num">4</div>
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div class="userInfo">
+                        <p>我的名字很长我的名字很长我的名字很长我的名字很长</p>
+                        <div class="mvp">
+                            <img src="./images/logo.png" alt="" class="mvpTx">
+                            <span>最佳助力</span>
+                        </div>
+                        <div class="member">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx1">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx2">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx3">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx4">
+                            <img src="./images/logo.png" alt="" class="memberTx memberTx5">
+                        </div>
+                    </div>
+                    <div class="score">
+                        <p>1000</p>
+                        <span>距上一名</span>
+                    </div>
+                </li> -->
+            </ul>
+        </div>
+    </div>
+    <!-- 自己榜单 -->
+    <div class="my">
+        <div class="num">未上榜</div>
+        <img src="./images/logo.png" alt="" class="tx">
+        <div class="score">
+            <p></p>
+            <span>距上一名还差 <b>0</b></span>
+        </div>
+        <div class="but">打榜助力</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="../../common/js/svga.js"></script>
+<script src="./js/index.js"></script>

view/yinmeng/modules/hourRank/js/index.js

@@ -0,0 +1,211 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+var urlData = getQueryString();
+if (env == 'test') {
+    new VConsole();
+}
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+var timeOut2;
+var leftTime;
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 页面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 顶部返回事件
+        $('.back').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        getHourRank();
+    }, 100)
+})
+// 小时榜接口
+function getHourRank () {
+    showLoading()
+    networkRequest({
+        type: 'GEt',
+        url: urlPrefix + '/single/broadcast/listHourRank',
+        data: { roomUid: urlData.roomUid },
+        success (res) {
+            if (res.code === 200) {
+                // ==================================设置倒计时===========================
+                nowTime = res.timestamp;
+                $('.largestBox .hourList .top .sp').text(`${dateFormat(nowTime, 'hh')}点 小时榜`)
+                // 获取当前时间
+                now = new Date(nowTime);
+                // 计算距离下一个小时的分钟数
+                var minutesToNextHour = (59 - now.getMinutes()) % 60;
+                // 计算距离下一个小时的秒数
+                var secondsToNextHour = 59 - now.getSeconds();
+                // 计算距离下一个小时的总时间（以毫秒为单位）
+                var timeToNextHour = (minutesToNextHour * 60 * 1000) + (secondsToNextHour * 1000);
+                leftTime = timeToNextHour;
+                countup();
+                // =================================上期前三===========================
+                lastHourRank = res.data.lastHourRank[0];
+                if (lastHourRank) {
+                    $('.largestBox .box .txbox .tx').attr("src", lastHourRank.avatar);
+                    $('.largestBox .box .txbox .hourTs').attr("roomUid", lastHourRank.uid);
+                    $('.largestBox .box .userInfo p').text(lastHourRank.nick);
+                    $('.largestBox .box .userInfo .mvp .mvpTx').attr("src", lastHourRank.assist.avatar);
+                    lastHourRank.micUsers.forEach((res, i) => {
+                        $(`.largestBox .hourList ul li .userInfo .member .memberTx${i + 1}`).attr("src", res.avatar);
+                    });
+                    $('.largestBox .box .score span').text(res.score);
+                } else {
+                    $('.largestBox .box .txbox .tx').attr("src", './images/logo.png');
+                    $('.largestBox .box .userInfo p').text('虚位以待');
+                    $('.largestBox .box .userInfo .mvp .mvpTx').attr("src", './images/logo.png');
+                    $('.largestBox .box .score span').text(0);
+                }
+                //================================= 当前小时榜===========================
+                $('.largestBox .hourList ul li').remove();
+                var str = '';
+                res.data.currHourRank.forEach((res, i) => {
+                    str += `
+                    <li class="li${i + 1}">
+                        <div class="num num${i + 1}">${i > 2 ? i : ''}</div>
+                        <img src="${res.avatar}" roomUid=${res.uid} alt="" class="tx">
+                        <div class="userInfo">
+                            <p>${res.nick}</p>
+                            <div class="mvp">
+                                <img src="${res.assist.avatar}" alt="" class="mvpTx">
+                                <span>最佳助力</span>
+                            </div>
+                            <div class="member">
+                                <img src="${res.micUsers[0] ? res.micUsers[0].avatar : './images/logo.png'}" alt="" class="memberTx memberTx1">
+                                <img src="${res.micUsers[1] ? res.micUsers[1].avatar : './images/logo.png'}" alt="" class="memberTx memberTx2">
+                                <img src="${res.micUsers[2] ? res.micUsers[2].avatar : './images/logo.png'}" alt="" class="memberTx memberTx3">
+                                <img src="${res.micUsers[3] ? res.micUsers[3].avatar : './images/logo.png'}" alt="" class="memberTx memberTx4">
+                                <img src="${res.micUsers[4] ? res.micUsers[4].avatar : './images/logo.png'}" alt="" class="memberTx memberTx5">
+                            </div>
+                        </div>
+                        <div class="score">
+                            <p>${i == 0 ? res.score : res.data.currHourRank[i - 1].score - res.score}</p>
+                            <span>距上一名</span>
+                        </div>
+                        <img style="display:${i == 0 ? 'block' : 'none'}" src="./images/first.png" alt="" class="first">
+                    </li>
+                    `
+                })
+                $('.largestBox .hourList ul').append(str);
+                // ====================================处理自己===========================
+                $('.my .tx').attr('src', res.data.currRoomInfo.avatar);
+                $('.my .tx').attr('uid', res.data.currRoomInfo.uid);
+                $('.my .score p').text(res.data.currRoomInfo.nick);
+                var uid = res.data.currRoomInfo.uid;
+                if (res.data.currHourRank.find(obj => obj.uid == res.data.currRoomInfo.uid)) {
+                    res.data.currHourRank.forEach((val, i) => {
+                        if (uid == val.uid) {
+                            $('.my .score span').show();
+                            $('.my .score span b').text(i == 0 ? 0 : res.data.currHourRank[i - 1].score - val.score);
+                            $(`.my .num`).text(i + 1);
+                            $(`.my .score p`).css('margin-top', '0rem')
+                        }
+                    })
+                } else {
+                    $('.my .score span').hide();
+                    $(`.my .num`).text('未上榜');
+                    $(`.my .score p`).css('margin-top', '0.3rem')
+                }
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 倒计时
+function countup () {
+    clearTimeout(timeOut2)
+    //获取当前时间
+    // var now = nowTime;
+    var d = 0;
+    var h = 0;
+    var m = 0;
+    var s = 0;
+    //定义变量 d,h,m,s保存倒计时的时间
+    var d, h, m, s;
+    //递归每秒调⽤countTime⽅法，显⽰动态时间效果 
+    if (leftTime > 0) {
+        d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
+        h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
+        m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
+        s = getzf(Math.floor(leftTime / 1000 % 60));
+        //将倒计时赋值到div中
+        // console.log("最终: " + dateFormat(leftTime, '00:mm:ss'));
+        $('.largestBox .hourList .top .sp2').html(`<span>剩余<b>${dateFormat(leftTime, 'mm')}</b>分<b>${dateFormat(leftTime, 'ss')}</b>秒</span>`)
+    } else {
+        getHourRank();
+    }
+    if (leftTime > 0) {
+        leftTime = leftTime - 1000;
+    }
+    timeOut2 = setTimeout(countup, 1000);
+}
+//补0操作  
+function getzf (num) {
+    if (parseInt(num) < 10) {
+        num = '0' + num;
+    }
+    return num;
+}
+// 点击前三跳转房间
+$('.largestBox').on('click', '.lastHour .box .txbox .hourTs', function () {
+    var roomUid = $(this).attr('roomUid');
+    if (browser.ios) {
+        window.webkit.messageHandlers.openRoom.postMessage(roomUid);
+    } else if (browser.android) {
+        if (androidJsObj && typeof androidJsObj === 'object') {
+            window.androidJsObj.openRoom(roomUid);
+        }
+    }
+})
+// 点击非前三跳转房间. 
+$('.largestBox').on('click', '.hourList ul li .tx', function () {
+    var roomUid = $(this).attr('roomUid');
+    if (browser.ios) {
+        window.webkit.messageHandlers.openRoom.postMessage(roomUid);
+    } else if (browser.android) {
+        if (androidJsObj && typeof androidJsObj === 'object') {
+            window.androidJsObj.openRoom(roomUid);
+        }
+    }
+})

view/yinmeng/modules/rank/index.html

@@ -1 +1 @@
-<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>音萌</title><link href=./static/css/app.f9f56c3a2b6e154e6ba49a184dcd22a0.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.72d4f0878a9bda2e3d57.js></script><script type=text/javascript src=./static/js/vendor.74d3f41533c4dd499a10.js></script><script type=text/javascript src=./static/js/app.490d2b5c45773badaad4.js></script></body></html>
+<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>音萌</title><link href=./static/css/app.f8b4f2ace8d9255780016f7da1a8dafd.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.e8ed7d88923c113579ee.js></script><script type=text/javascript src=./static/js/vendor.74d3f41533c4dd499a10.js></script><script type=text/javascript src=./static/js/app.f8a444458a0124bc2d1d.js></script></body></html>

view/yinmeng/modules/rank/static/js/3.8b79e4bd0ec643476e46.js

@@ -1,2 +0,0 @@
-webpackJsonp([3],{"5zde":function(t,a,i){i("zQR9"),i("qyJz"),t.exports=i("FeBl").Array.from},Gu7T:function(t,a,i){"use strict";a.__esModule=!0;var n,e=i("c/Tr"),s=(n=e)&&n.__esModule?n:{default:n};a.default=function(t){if(Array.isArray(t)){for(var a=0,i=Array(t.length);a<t.length;a++)i[a]=t[a];return i}return(0,s.default)(t)}},W02H:function(t,a,i){"use strict";Object.defineProperty(a,"__esModule",{value:!0});var n=i("Gu7T"),e=i.n(n),s=i("BRgg"),o={data:function(){return{tabList:["今日榜单","昨日榜单"],wishTab:["幸运许愿池","梦幻许愿池"],wishType:1,diamondBoxSwitch:!1,tabType:1,page:0,loading:!1,finished:!1,dataList:[]}},created:function(){document.title=this.$route.meta.title,this.getBoxSwitch()},methods:{formatTotal:function(t){return t},getBoxSwitch:function(){var t=this;Object(s.b)().then(function(a){t.diamondBoxSwitch=a.data.data.diamondBoxSwitch})},onLoad:function(){this.page++,this.getData()},getData:function(){var t=this;Object(s.d)({type:this.wishType,pageSize:20,datetype:this.tabType,page:this.page}).then(function(a){var i;console.log(a.data.rankVos),(i=t.dataList).push.apply(i,e()(a.data.data.rankVos)),t.loading=!1,console.log(t.dataList),a.data.data.rankVos.length<20&&(t.finished=!0)})},setTabType:function(t){t!==this.tabType&&(this.tabType=t,this.dataList=[],this.finished=!1,this.loading=!0,this.page=0,this.onLoad())},setWishType:function(t){this.wishType!==t&&(this.dataList=[],this.wishType=t,this.finished=!1,this.loading=!0,this.tabType=1,this.page=0,this.onLoad())}}},r={render:function(){var t=this,a=t.$createElement,i=t._self._c||a;return i("div",[i("div",{ref:"tab",class:t.diamondBoxSwitch?"tab-wrapper":"tab-wrapper blank"},t._l(t.tabList,function(a,n){return i("div",{key:n,class:n+1===t.tabType?"active tab":"tab",on:{click:function(a){return t.setTabType(n+1)}}},[t._v("\n      "+t._s(a)+"\n      "),i("span",{staticClass:"subscript-one"})])}),0),t._v(" "),i("van-list",{class:t.diamondBoxSwitch?"swiper":"swiper blank",attrs:{finished:t.finished,"finished-text":"没有更多了"},on:{load:t.onLoad},model:{value:t.loading,callback:function(a){t.loading=a},expression:"loading"}},t._l(t.dataList,function(a,n){return i("div",{key:n,staticClass:"user"},[i("img",{attrs:{src:a.avatar,alt:""}}),t._v(" "),a.nick?i("p",{staticClass:"user-nick"},[t._v("\n        "+t._s(a.nick.length>7?a.nick.slice(0,7)+"...":a.nick)+"\n      ")]):t._e(),t._v(" "),i("p",{staticClass:"user-diamond"},[i("span",{staticClass:"diamond-num"},[t._v(t._s(t.formatTotal(a.amount)))]),t._v(" "),i("span",{staticClass:"diamond-img"})])])}),0)],1)},staticRenderFns:[]};var d=i("VU/8")(o,r,!1,function(t){i("xZT/")},"data-v-288b2542",null);a.default=d.exports},"c/Tr":function(t,a,i){t.exports={default:i("5zde"),__esModule:!0}},fBQ2:function(t,a,i){"use strict";var n=i("evD5"),e=i("X8DO");t.exports=function(t,a,i){a in t?n.f(t,a,e(0,i)):t[a]=i}},qyJz:function(t,a,i){"use strict";var n=i("+ZMJ"),e=i("kM2E"),s=i("sB3e"),o=i("msXi"),r=i("Mhyx"),d=i("QRG4"),c=i("fBQ2"),u=i("3fs2");e(e.S+e.F*!i("dY0y")(function(t){Array.from(t)}),"Array",{from:function(t){var a,i,e,l,h=s(t),f="function"==typeof this?this:Array,p=arguments.length,v=p>1?arguments[1]:void 0,y=void 0!==v,g=0,b=u(h);if(y&&(v=n(v,p>2?arguments[2]:void 0,2)),void 0==b||f==Array&&r(b))for(i=new f(a=d(h.length));a>g;g++)c(i,g,y?v(h[g],g):h[g]);else for(l=b.call(h),i=new f;!(e=l.next()).done;g++)c(i,g,y?o(l,v,[e.value,g],!0):e.value);return i.length=g,i}})},"xZT/":function(t,a){}});
-//# sourceMappingURL=3.8b79e4bd0ec643476e46.js.map

view/yinmeng/modules/rank/static/js/3.e16ec41d20e9be53c63c.js

@@ -0,0 +1,2 @@
+webpackJsonp([3],{"5zde":function(t,a,i){i("zQR9"),i("qyJz"),t.exports=i("FeBl").Array.from},Gu7T:function(t,a,i){"use strict";a.__esModule=!0;var n,e=i("c/Tr"),s=(n=e)&&n.__esModule?n:{default:n};a.default=function(t){if(Array.isArray(t)){for(var a=0,i=Array(t.length);a<t.length;a++)i[a]=t[a];return i}return(0,s.default)(t)}},UMf0:function(t,a){},W02H:function(t,a,i){"use strict";Object.defineProperty(a,"__esModule",{value:!0});var n=i("Gu7T"),e=i.n(n),s=i("BRgg"),o={data:function(){return{tabList:["今日榜单","昨日榜单"],wishTab:["幸运许愿池","梦幻许愿池"],wishType:1,diamondBoxSwitch:!1,tabType:1,page:0,loading:!1,finished:!1,dataList:[]}},created:function(){document.title=this.$route.meta.title,this.getBoxSwitch()},methods:{formatTotal:function(t){return t},getBoxSwitch:function(){var t=this;Object(s.b)().then(function(a){t.diamondBoxSwitch=a.data.data.diamondBoxSwitch})},onLoad:function(){this.page++,this.getData()},getData:function(){var t=this;Object(s.d)({type:this.wishType,pageSize:20,datetype:this.tabType,page:this.page}).then(function(a){var i;console.log(a.data.rankVos),(i=t.dataList).push.apply(i,e()(a.data.data.rankVos)),t.loading=!1,console.log(t.dataList),a.data.data.rankVos.length<20&&(t.finished=!0)})},setTabType:function(t){t!==this.tabType&&(this.tabType=t,this.dataList=[],this.finished=!1,this.loading=!0,this.page=0,this.onLoad())},setWishType:function(t){this.wishType!==t&&(this.dataList=[],this.wishType=t,this.finished=!1,this.loading=!0,this.tabType=1,this.page=0,this.onLoad())}}},r={render:function(){var t=this,a=t.$createElement,i=t._self._c||a;return i("div",[i("div",{ref:"tab",class:t.diamondBoxSwitch?"tab-wrapper":"tab-wrapper blank"},t._l(t.tabList,function(a,n){return i("div",{key:n,class:n+1===t.tabType?"active tab":"tab",on:{click:function(a){return t.setTabType(n+1)}}},[t._v("\n      "+t._s(a)+"\n      "),i("span",{staticClass:"subscript-one"})])}),0),t._v(" "),i("van-list",{class:t.diamondBoxSwitch?"swiper":"swiper blank",attrs:{finished:t.finished,"finished-text":"没有更多了"},on:{load:t.onLoad},model:{value:t.loading,callback:function(a){t.loading=a},expression:"loading"}},t._l(t.dataList,function(a,n){return i("div",{key:n,staticClass:"user"},[i("img",{attrs:{src:a.avatar,alt:""}}),t._v(" "),a.nick?i("p",{staticClass:"user-nick"},[t._v("\n        "+t._s(a.nick.length>7?a.nick.slice(0,7)+"...":a.nick)+"\n      ")]):t._e(),t._v(" "),i("p",{staticClass:"user-diamond"},[i("span",{staticClass:"diamond-num"},[t._v(t._s(t.formatTotal(a.amount)))]),t._v(" "),i("span",{staticClass:"diamond-img"})])])}),0)],1)},staticRenderFns:[]};var d=i("VU/8")(o,r,!1,function(t){i("UMf0")},"data-v-4145c79c",null);a.default=d.exports},"c/Tr":function(t,a,i){t.exports={default:i("5zde"),__esModule:!0}},fBQ2:function(t,a,i){"use strict";var n=i("evD5"),e=i("X8DO");t.exports=function(t,a,i){a in t?n.f(t,a,e(0,i)):t[a]=i}},qyJz:function(t,a,i){"use strict";var n=i("+ZMJ"),e=i("kM2E"),s=i("sB3e"),o=i("msXi"),r=i("Mhyx"),d=i("QRG4"),c=i("fBQ2"),u=i("3fs2");e(e.S+e.F*!i("dY0y")(function(t){Array.from(t)}),"Array",{from:function(t){var a,i,e,l,f=s(t),h="function"==typeof this?this:Array,p=arguments.length,v=p>1?arguments[1]:void 0,y=void 0!==v,g=0,b=u(f);if(y&&(v=n(v,p>2?arguments[2]:void 0,2)),void 0==b||h==Array&&r(b))for(i=new h(a=d(f.length));a>g;g++)c(i,g,y?v(f[g],g):f[g]);else for(l=b.call(f),i=new h;!(e=l.next()).done;g++)c(i,g,y?o(l,v,[e.value,g],!0):e.value);return i.length=g,i}})}});
+//# sourceMappingURL=3.e16ec41d20e9be53c63c.js.map

view/yinmeng/modules/rank/static/js/4.76d58a1190c5fed3826d.js

@@ -1,2 +0,0 @@
-webpackJsonp([4],{FmjD:function(e,t){},bxJL:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var c=n("Z4iZ"),i=void 0;i="test"===Object(c.a)()?"http://beta.api.nnbc123.cn":"https://api.nnbc123.cn";var a={created:function(){window.location.href=i+"/yinmeng/modules/rule/wishingWellRule.html"}},o={render:function(){var e=this.$createElement;return(this._self._c||e)("div")},staticRenderFns:[]};var r=n("VU/8")(a,o,!1,function(e){n("FmjD")},"data-v-cc7926ee",null);t.default=r.exports}});
-//# sourceMappingURL=4.76d58a1190c5fed3826d.js.map

view/yinmeng/modules/rank/static/js/4.9e688a9b2696fa3ac8bd.js

@@ -1,2 +1,2 @@
-webpackJsonp([5],{O1Gz:function(t,e){},ht4E:function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=a("BRgg"),n={data:function(){return{dataList:[],loading:!1,finished:!1,page:0}},created:function(){document.title=this.$route.meta.title},methods:{onLoad:function(){var t=this;this.page++,Object(i.e)({pageSize:20,page:this.page,uid:window.sessionStorage.getItem("uid")||"935026",sortType:"time"}).then(function(e){t.dataList=t.dataList.concat(e.data.data),t.loading=!1,console.log(e.data.data),e.data.data.length<20&&(t.finished=!0)})},createTime:function(t){return function(t){var e=new Date(t),a=(e.getFullYear(),e.getMonth()+1);a=a<10?"0"+a:a;var i=e.getDate();i=i<10?"0"+i:i;var n=e.getHours();n=n<10?"0"+n:n;var s=e.getMinutes();s=s<10?"0"+s:s;var r=e.getSeconds();return r=r<10?"0"+r:r,a+"-"+i+" "+n+":"+s}(t)}}},s={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"max"},[a("p",{staticClass:"tit"},[t._v("获奖记录")]),t._v(" "),a("div",{staticClass:"list"},[a("van-list",{attrs:{finished:t.finished,"finished-text":"没有更多获奖记录了",offset:300},on:{load:t.onLoad},model:{value:t.loading,callback:function(e){t.loading=e},expression:"loading"}},t._l(t.dataList,function(e,i){return a("div",{key:i,staticClass:"user"},[a("img",{attrs:{src:e.prizeImgUrl,alt:""}}),t._v(" "),a("p",{staticClass:"user-nick"},[t._v("\n          "+t._s(e.prizeName)+"\n          "),a("span",[t._v(" X "+t._s(e.prizeNum))])]),t._v(" "),a("p",{staticClass:"user-diamond"},[a("span",{staticClass:"diamond-num"},[t._v(t._s(t.createTime(e.createTime)))])])])}),0)],1)])},staticRenderFns:[]};var r=a("VU/8")(n,s,!1,function(t){a("O1Gz")},"data-v-8efc1848",null);e.default=r.exports}});
+webpackJsonp([4],{RL3y:function(t,e){},ht4E:function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=a("BRgg"),n={data:function(){return{dataList:[],loading:!1,finished:!1,page:0}},created:function(){document.title=this.$route.meta.title},methods:{onLoad:function(){var t=this;this.page++,Object(i.e)({pageSize:20,page:this.page,uid:window.sessionStorage.getItem("uid")||"935026",sortType:"time"}).then(function(e){t.dataList=t.dataList.concat(e.data.data),t.loading=!1,console.log(e.data.data),e.data.data.length<20&&(t.finished=!0)})},createTime:function(t){return function(t){var e=new Date(t),a=(e.getFullYear(),e.getMonth()+1);a=a<10?"0"+a:a;var i=e.getDate();i=i<10?"0"+i:i;var n=e.getHours();n=n<10?"0"+n:n;var s=e.getMinutes();s=s<10?"0"+s:s;var r=e.getSeconds();return r=r<10?"0"+r:r,a+"-"+i+" "+n+":"+s}(t)}}},s={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"max"},[a("p",{staticClass:"tit"},[t._v("获奖记录")]),t._v(" "),a("div",{staticClass:"list"},[a("van-list",{attrs:{finished:t.finished,"finished-text":"没有更多获奖记录了",offset:300},on:{load:t.onLoad},model:{value:t.loading,callback:function(e){t.loading=e},expression:"loading"}},t._l(t.dataList,function(e,i){return a("div",{key:i,staticClass:"user"},[a("img",{attrs:{src:e.prizeImgUrl,alt:""}}),t._v(" "),a("p",{staticClass:"user-nick"},[t._v("\n          "+t._s(e.prizeName)+"\n          "),a("span",[t._v(" X "+t._s(e.prizeNum))])]),t._v(" "),a("p",{staticClass:"user-diamond"},[a("span",{staticClass:"diamond-num"},[t._v(t._s(t.createTime(e.createTime)))])])])}),0)],1)])},staticRenderFns:[]};var r=a("VU/8")(n,s,!1,function(t){a("RL3y")},"data-v-f356f33c",null);e.default=r.exports}});
-//# sourceMappingURL=5.b647f8aa8a2f5fcd4e34.js.map
+//# sourceMappingURL=4.9e688a9b2696fa3ac8bd.js.map

view/yinmeng/modules/rank/static/js/5.3490e0ae8df7c19b4380.js

@@ -0,0 +1,2 @@
+webpackJsonp([5],{"2D7G":function(e,t){},bxJL:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n("Z4iZ"),c=void 0;c="test"===Object(i.a)()?"http://beta.api.nnbc123.cn":"https://api.nnbc123.cn";var a={created:function(){window.location.href=c+"/yinmeng/modules/rule/wishingWellRule.html"}},r={render:function(){var e=this.$createElement;return(this._self._c||e)("div")},staticRenderFns:[]};var l=n("VU/8")(a,r,!1,function(e){n("2D7G")},"data-v-72576b74",null);t.default=l.exports}});
+//# sourceMappingURL=5.3490e0ae8df7c19b4380.js.map

view/yinmeng/modules/rank/static/js/app.490d2b5c45773badaad4.js

@@ -1,2 +0,0 @@
-webpackJsonp([7],{"/CRi":function(e,n){},"2KIr":function(e,n){},"4ml/":function(e,n){},NHnr:function(e,n,t){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var i=t("7+uW"),o={render:function(){var e=this.$createElement,n=this._self._c||e;return n("div",{attrs:{id:"app"}},[n("router-view")],1)},staticRenderFns:[]};var a=t("VU/8")({name:"App"},o,!1,function(e){t("zvPW")},null,null).exports,r=t("YaEn"),u=(t("2KIr"),t("NYxO"));i.default.use(u.a);var s=new u.a.Store({state:{info:{ticket:"123",uid:"678"}},mutations:{setInfo:function(e,n){e.info.ticket=n.ticket,e.info.uid=n.uid}},getters:{getInfo:function(e){return e.info}},actions:{getUserInfo:function(e){return e.state}}}),d=t("pFYg"),c=t.n(d),f=t("Z4iZ");window.info={},window.getMessage=function(e,n){info[e]=n};var l=t("SV4X"),p=t.n(l),m=(t("/CRi"),t("4ml/"),t("Fd2+")),w=(t("sVYa"),t("DVXL")),h=t.n(w);!function(){var e=Object(f.b)();if(e.app)if(e.ios){var n=document.cookie.match(/\d+/);info.uid=n[0],window.webkit.messageHandlers.getTicket.postMessage(null)}else e.android&&androidJsObj&&"object"===("undefined"==typeof androidJsObj?"undefined":c()(androidJsObj))&&(info.uid=parseInt(window.androidJsObj.getUid()),info.ticket=window.androidJsObj.getTicket());else info.uid=1005337,info.ticket="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjoxMDA1MzM3LCJ0aWNrZXRfaWQiOiIzZmRmNDQwOS03MTM2LTRkOTItOWE0Yy1hZTkyMjg2YjAyMGUiLCJleHAiOjM2MDAsImNsaWVudF9pZCI6ImVyYmFuLWNsaWVudCJ9.X6mEVLMxFkBtPWW0g1OuL_xOpeGJlNWRsp5fKIKUo3Y"}(),i.default.config.productionTip=!1,i.default.prototype.$layer=p()(i.default),h.a.attach(document.body),i.default.use(m.b),new i.default({el:"#app",router:r.a,store:s,components:{App:a},template:"<App/>"})},YaEn:function(e,n,t){"use strict";var i=t("7+uW"),o=t("/ocq");i.default.use(o.a);var a=new o.a({routes:[{path:"/rank",name:"rank",component:function(){return Promise.all([t.e(0),t.e(1)]).then(t.bind(null,"XwoE"))},meta:{title:"排行榜"}},{path:"/wishingWellRank",name:"wishingWellRank",meta:{title:"许愿池榜单"},component:function(){return Promise.all([t.e(0),t.e(3)]).then(t.bind(null,"W02H"))}},{path:"/wishingWellRecord",name:"wishingWellRecord",meta:{title:"许愿池中奖记录"},component:function(){return Promise.all([t.e(0),t.e(5)]).then(t.bind(null,"ht4E"))}},{path:"/wishingWellRule",name:"wishingWellRule",meta:{title:"玩法规则"},component:function(){return t.e(4).then(t.bind(null,"bxJL"))}},{path:"/DiamondLog",name:"DiamondLog",meta:{title:"钻石记录"},component:function(){return Promise.all([t.e(0),t.e(2)]).then(t.bind(null,"zXe3"))}}]});a.beforeEach(function(e,n,t){window.sessionStorage.getItem("ticket")?t():setTimeout(function(){sessionStorage.clear(),window.sessionStorage.setItem("uid",info.uid),window.sessionStorage.setItem("ticket",info.ticket),console.log(info,"router"),t()},70)}),n.a=a},Z4iZ:function(e,n,t){"use strict";t.d(n,"b",function(){return i}),t.d(n,"a",function(){return o});var i=function(){var e=navigator.userAgent;navigator.appVersion;return{trident:e.indexOf("Trident")>-1,presto:e.indexOf("Presto")>-1,webKit:e.indexOf("AppleWebKit")>-1,gecko:e.indexOf("Gecko")>-1&&-1==e.indexOf("KHTML"),mobile:!!e.match(/AppleWebKit.*Mobile.*/),ios:!!e.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),android:e.indexOf("Android")>-1||e.indexOf("Adr")>-1,iPhone:e.indexOf("iPhone")>-1,iPad:e.indexOf("iPad")>-1,webApp:-1==e.indexOf("Safari"),weixin:e.indexOf("MicroMessenger")>-1,qq:" qq"==e.match(/\sQQ/i),app:"tutuApp"==e.match("tutuApp")}},o=function(){if(window.location.href){var e=window.location.href,n=e.match(/api.uat.z/),t=e.match(/120.79.211.243/),i=e.match(/api.uat/),o=e.match(/127.0.0.1/);return n||t||i||o?"test":"live"}}},afzy:function(e,n,t){"use strict";function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e}).apply(this,arguments)}n.a=i},zvPW:function(e,n){}},["NHnr"]);
-//# sourceMappingURL=app.490d2b5c45773badaad4.js.map

view/yinmeng/modules/rank/static/js/app.f8a444458a0124bc2d1d.js

@@ -0,0 +1,2 @@
+webpackJsonp([7],{"/CRi":function(e,n){},"/oxU":function(e,n){},"2KIr":function(e,n){},"4ml/":function(e,n){},NHnr:function(e,n,t){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var i=t("7+uW"),o={render:function(){var e=this.$createElement,n=this._self._c||e;return n("div",{attrs:{id:"app"}},[n("router-view")],1)},staticRenderFns:[]};var a=t("VU/8")({name:"App"},o,!1,function(e){t("/oxU")},null,null).exports,r=t("YaEn"),u=(t("2KIr"),t("NYxO"));i.default.use(u.a);var s=new u.a.Store({state:{info:{ticket:"123",uid:"678"}},mutations:{setInfo:function(e,n){e.info.ticket=n.ticket,e.info.uid=n.uid}},getters:{getInfo:function(e){return e.info}},actions:{getUserInfo:function(e){return e.state}}}),d=t("pFYg"),c=t.n(d),f=t("Z4iZ");window.info={},window.getMessage=function(e,n){info[e]=n};var l=t("SV4X"),p=t.n(l),m=(t("/CRi"),t("4ml/"),t("Fd2+")),w=(t("sVYa"),t("DVXL")),h=t.n(w);!function(){var e=Object(f.b)();if(e.app)if(e.ios){var n=document.cookie.match(/\d+/);info.uid=n[0],window.webkit.messageHandlers.getTicket.postMessage(null)}else e.android&&androidJsObj&&"object"===("undefined"==typeof androidJsObj?"undefined":c()(androidJsObj))&&(info.uid=parseInt(window.androidJsObj.getUid()),info.ticket=window.androidJsObj.getTicket());else info.uid=1005337,info.ticket="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjoxMDA1MzM3LCJ0aWNrZXRfaWQiOiIzZmRmNDQwOS03MTM2LTRkOTItOWE0Yy1hZTkyMjg2YjAyMGUiLCJleHAiOjM2MDAsImNsaWVudF9pZCI6ImVyYmFuLWNsaWVudCJ9.X6mEVLMxFkBtPWW0g1OuL_xOpeGJlNWRsp5fKIKUo3Y"}(),i.default.config.productionTip=!1,i.default.prototype.$layer=p()(i.default),h.a.attach(document.body),i.default.use(m.b),new i.default({el:"#app",router:r.a,store:s,components:{App:a},template:"<App/>"})},YaEn:function(e,n,t){"use strict";var i=t("7+uW"),o=t("/ocq");i.default.use(o.a);var a=new o.a({routes:[{path:"/rank",name:"rank",component:function(){return Promise.all([t.e(0),t.e(1)]).then(t.bind(null,"XwoE"))},meta:{title:"排行榜"}},{path:"/wishingWellRank",name:"wishingWellRank",meta:{title:"许愿池榜单"},component:function(){return Promise.all([t.e(0),t.e(3)]).then(t.bind(null,"W02H"))}},{path:"/wishingWellRecord",name:"wishingWellRecord",meta:{title:"许愿池中奖记录"},component:function(){return Promise.all([t.e(0),t.e(4)]).then(t.bind(null,"ht4E"))}},{path:"/wishingWellRule",name:"wishingWellRule",meta:{title:"玩法规则"},component:function(){return t.e(5).then(t.bind(null,"bxJL"))}},{path:"/DiamondLog",name:"DiamondLog",meta:{title:"钻石记录"},component:function(){return Promise.all([t.e(0),t.e(2)]).then(t.bind(null,"zXe3"))}}]});a.beforeEach(function(e,n,t){window.sessionStorage.getItem("ticket")?t():setTimeout(function(){sessionStorage.clear(),window.sessionStorage.setItem("uid",info.uid),window.sessionStorage.setItem("ticket",info.ticket),console.log(info,"router"),t()},70)}),n.a=a},Z4iZ:function(e,n,t){"use strict";t.d(n,"b",function(){return i}),t.d(n,"a",function(){return o});var i=function(){var e=navigator.userAgent;navigator.appVersion;return{trident:e.indexOf("Trident")>-1,presto:e.indexOf("Presto")>-1,webKit:e.indexOf("AppleWebKit")>-1,gecko:e.indexOf("Gecko")>-1&&-1==e.indexOf("KHTML"),mobile:!!e.match(/AppleWebKit.*Mobile.*/),ios:!!e.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),android:e.indexOf("Android")>-1||e.indexOf("Adr")>-1,iPhone:e.indexOf("iPhone")>-1,iPad:e.indexOf("iPad")>-1,webApp:-1==e.indexOf("Safari"),weixin:e.indexOf("MicroMessenger")>-1,qq:" qq"==e.match(/\sQQ/i),app:"tutuApp"==e.match("tutuApp")}},o=function(){if(window.location.href){var e=window.location.href,n=e.match(/api.uat.z/),t=e.match(/120.79.211.243/),i=e.match(/api.uat/),o=e.match(/127.0.0.1/);return n||t||i||o?"test":"live"}}},afzy:function(e,n,t){"use strict";function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e}).apply(this,arguments)}n.a=i}},["NHnr"]);
+//# sourceMappingURL=app.f8a444458a0124bc2d1d.js.map

view/yinmeng/modules/rank/static/js/manifest.e8ed7d88923c113579ee.js

@@ -1,2 +1,2 @@
-!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,a){for(var i,u,f,d=0,s=[];d<r.length;d++)u=r[d],t[u]&&s.push(t[u][0]),t[u]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(n&&n(r,c,a);s.length;)s.shift()();if(a)for(d=0;d<a.length;d++)f=o(o.s=a[d]);return f};var r={},t={8:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+e+"."+{0:"cdbe8cbca8858159dee1",1:"5d02d9c60cca1fc97e73",2:"51a3c5acd13ab98d55cc",3:"8b79e4bd0ec643476e46",4:"76d58a1190c5fed3826d",5:"b647f8aa8a2f5fcd4e34"}[e]+".js";var i=setTimeout(u,12e4);function u(){a.onerror=a.onload=null,clearTimeout(i);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return a.onerror=a.onload=u,c.appendChild(a),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
+!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,a){for(var i,u,d,f=0,s=[];f<r.length;f++)u=r[f],t[u]&&s.push(t[u][0]),t[u]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(n&&n(r,c,a);s.length;)s.shift()();if(a)for(f=0;f<a.length;f++)d=o(o.s=a[f]);return d};var r={},t={8:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+e+"."+{0:"9abdd6498fd7d9f0d2dd",1:"801e4d61cd9d5e319a52",2:"73ab44093dd8bc50680e",3:"e16ec41d20e9be53c63c",4:"9e688a9b2696fa3ac8bd",5:"3490e0ae8df7c19b4380"}[e]+".js";var i=setTimeout(u,12e4);function u(){a.onerror=a.onload=null,clearTimeout(i);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return a.onerror=a.onload=u,c.appendChild(a),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
-//# sourceMappingURL=manifest.72d4f0878a9bda2e3d57.js.map
+//# sourceMappingURL=manifest.e8ed7d88923c113579ee.js.map

view/yinmeng/modules/ranks/index.html

@@ -0,0 +1,177 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>荣耀榜</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 头部 -->
+    <div class="header">
+        <!-- 标题 -->
+        <div class="title">
+            <img src="./images/back.png" alt="" class="back">
+            <span>荣耀榜</span>
+        </div>
+        <!-- tab榜单切换 -->
+        <div class="tab">
+            <div class="active1">爱意榜<span></span></div>
+            <div>魅力榜<span></span></div>
+            <div>房间榜<span></span></div>
+            <div>公会榜<span></span></div>
+        </div>
+        <!-- 榜单周期切换 timeTab2-->
+        <div class="timeTab ">
+            <div class="active divBg1">小时榜</div>
+            <div class="active1 divBg1">日榜</div>
+            <div class="divBg1">周榜</div>
+            <div class="divBg1">月榜</div>
+        </div>
+        <!-- 上期前三 -->
+        <div class="listLast">
+            <span class="sp1">上期TOP3 ></span>
+        </div>
+        <!-- 前三榜单 -->
+        <div class="topBox topBox1">
+            <div class="no no1">
+                <img src="./images/no1.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <img src="./images/logo.png" alt="" class="zl">
+                <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                <p>
+                    <span class="girl"><img src="./images/girl.png" alt=""></span>
+                </p>
+                <div class="icon">
+                    <img class="icon1" src="" alt="">
+                    <img class="icon2" src="" alt="">
+                </div>
+                <!-- <i>距上一名111.5W</i> -->
+                <img src="" alt="" class="icon_gh">
+            </div>
+            <div class="no no2">
+                <img src="./images/no2.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <img src="./images/logo.png" alt="" class="zl">
+                <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                <p>
+                    <span class="girl"><img src="./images/girl.png" alt=""></span>
+                </p>
+                <div class="icon">
+                    <img class="icon1" src="" alt="">
+                    <img class="icon2" src="" alt="">
+                </div>
+                <i></i>
+                <img src="" alt="" class="icon_gh">
+            </div>
+            <div class="no no3">
+                <img src="./images/no3.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <img src="./images/logo.png" alt="" class="zl">
+                <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                <p>
+                    <span class="girl"><img src="./images/girl.png" alt=""></span>
+                </p>
+                <div class="icon">
+                    <img class="icon1" src="" alt="">
+                    <img class="icon2" src="" alt="">
+                </div>
+                <i></i>
+                <img src="" alt="" class="icon_gh">
+            </div>
+        </div>
+    </div>
+    <!-- 非前三 -->
+    <ul class="list">
+        <li>
+            <div class="num">44.</div>
+            <img src="./images/logo.png" alt="" class="tx">
+            <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga" style="display: block;"></div>
+            <div class="nameBox">
+                <p>我的名嗷字啊啊...
+                    <span class="girl"><img src="./images/girl.png" alt=""></span>
+                </p>
+                <div class="icon">
+                    <img src="./images/icon1.png" alt="">
+                    <img src="./images/icon2.png" alt="">
+                </div>
+            </div>
+            <div class="right">
+                <img src="./images/logo.png" alt="">
+                <div class="nick">啊啊啊啊啊啊啊啊啊啊啊</div>
+                <p>最佳助力</p>
+            </div>
+            <div class="score">
+                <b>191.1W</b>
+                <i>距上一名</i>
+            </div>
+            <img src="" alt="" class="icon_gh">
+        </li>
+    </ul>
+    <!-- 自己榜单 -->
+    <div class="my">
+        <div class="num">未上榜</div>
+        <img src="./images/logo.png" alt="" class="tx">
+        <p class="name"></p>
+        <div class="score"><b>0</b> <i>爱意值</i></div>
+    </div>
+    <!-- 上期前弹窗 -->
+    <div class="lastTopThree">
+        <div class="lastTopThree_in">
+            <div class="box">
+                <div class="no no1">
+                    <img src="./images/no1.png" alt="" class="ts">
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                    <p>
+                        <span class="girl"><img src="./images/girl.png" alt=""></span>
+                    </p>
+                    <div class="icon">
+                        <img class="icon1" src="./images/icon1.png" alt="">
+                        <img class="icon2" src="./images/icon2.png" alt="">
+                    </div>
+                    <img src="" alt="" class="icon_gh">
+                </div>
+                <div class="no no2">
+                    <img src="./images/no2.png" alt="" class="ts">
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                    <p>
+                        <span class="girl"><img src="./images/girl.png" alt=""></span>
+                    </p>
+                    <div class="icon">
+                        <img class="icon1" src="./images/icon1.png" alt="">
+                        <img class="icon2" src="./images/icon2.png" alt="">
+                    </div>
+                    <img src="" alt="" class="icon_gh">
+                </div>
+                <div class="no no3">
+                    <img src="./images/no3.png" alt="" class="ts">
+                    <img src="./images/logo.png" alt="" class="tx">
+                    <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga"></div>
+                    <p>
+                        <span class="girl"><img src="./images/girl.png" alt=""></span>
+                    </p>
+                    <div class="icon">
+                        <img class="icon1" src="./images/icon1.png" alt="">
+                        <img class="icon2" src="./images/icon2.png" alt="">
+                    </div>
+                    <img src="" alt="" class="icon_gh">
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="../../common/js/svga.js"></script>
+<script src="./js/index.js"></script>

view/yinmeng/modules/ranks/js/index.js

@@ -0,0 +1,490 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+var listType = 1;//榜单类型
+var datetype = 1;//时间类型 1 日 2 周 3 总 4 半小时 5 月 6 小时
+var type = 2;//榜单类型 1 收礼榜 2 送礼榜 3 房间榜
+var charmImgUrl = 'https://yinmeng-1318633625.cos.ap-guangzhou.myqcloud.com/new_charm_';
+var experImgUrl = 'https://yinmeng-1318633625.cos.ap-guangzhou.myqcloud.com/new_exper_';
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 页面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 顶部返回事件
+        $('.back').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        getRank(type, datetype);
+    }, 100)
+})
+// 获取榜单接口
+function getRank (type, datetype) {
+    $('.list li').remove();
+    showLoading()
+    networkRequest({
+        type: 'GEt',
+        url: urlPrefix + '/allrank/geth5',
+        data: { type, datetype, uid: pubInfo.uid },
+        success (res) {
+            if (res.code === 200) {
+                var top3 = res.data.rankVoList.slice(0, 3);
+                var notTop3 = res.data.rankVoList.slice(3);
+                var arrAll = res.data.rankVoList;
+                // 处理前三
+                if (top3.length < 3) {
+                    let arr = new Array(3 - top3.length).fill({
+                        avatar: './images/logo.png',
+                        nick: '虚位以待',
+                        totalNum: "",
+                        gender: '',
+                        uid: '',
+                        inMic: '',
+                        inRoomUid: '',
+                    })
+                    top3.push(...arr)
+                }
+                top3.forEach((res, i) => {
+                    if (res.nick == '虚位以待') {
+                        $(`.header .topBox .no${i + 1} p span img`).hide();
+                        $(`.header .topBox .no${i + 1} .icon`).hide();
+                        $(`.header .topBox .no${i + 1} i`).hide();
+                        $(`.header .topBox .no${i + 1} .zl`).hide();
+                    } else {
+                        $(`.header .topBox .no${i + 1} p span img`).show();
+                        $(`.header .topBox .no${i + 1} .icon`).show();
+                        $(`.header .topBox .no${i + 1} i`).show();
+                        $(`.header .topBox .no${i + 1} .zl`).show();
+                    }
+                    if (type == 2) {
+                        $(`.header .topBox .no${i + 1} .zl`).hide();
+                    } else {
+                        $(`.header .topBox .no${i + 1} .zl`).show();
+                    }
+                    $(`.header .topBox .no${i + 1} .ts`).attr('uid', res.uid);
+                    $(`.header .topBox .no${i + 1} .ts`).attr('inRoomUid', res.inRoomUid);
+                    $(`.header .topBox .no${i + 1} .ts`).attr('inMic', res.inMic);
+                    $(`.header .topBox .no${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.header .topBox .no${i + 1} .zl`).attr('src', res.assist ? res.assist.avatar : './images/logo.png');
+                    $(`.header .topBox .no${i + 1} p`).html(`${res.nick.length > 6 ? `${res.nick.slice(0, 6)}...` : res.nick}<span class="${res.gender == 1 ? 'boy' : 'girl'}"><img src="./images/${res.gender == 1 ? 'boy' : 'girl'}.png" alt=""></span>`);
+                    $(`.header .topBox .no${i + 1} .icon .icon1`).attr('src', experImgUrl + `${res.experSeq <= 9 ? '0' + res.experSeq : res.experSeq}.png`);
+                    $(`.header .topBox .no${i + 1} .icon .icon2`).attr('src', charmImgUrl + `${res.charmSeq <= 9 ? '0' + res.charmSeq : res.charmSeq}.png`);
+                    if (i >= 1) {
+                        $(`.header .topBox .no${i + 1} i`).text(`距上一名${unitProcessing((top3[i - 1].totalNum - res.totalNum), 10000, 1, 'W')}`);
+                    }
+                    if (res.inMic) {
+                        $(`.header .topBox .no${i + 1} .svga`).show();
+                    } else {
+                        $(`.header .topBox .no${i + 1} .svga`).hide();
+                    }
+                })
+                // 处理非前三
+                var str = '';
+                notTop3.forEach((res, i) => {
+
+                    str += `
+                        <li>
+                            <div class="num">${res.seqNo}</div>
+                            <img src="${res.avatar}" alt="" class="tx" uid="${res.uid}" inRoomUid = '${res.inRoomUid}' inMic="${res.inMic}" ">
+                            <div src="./images/live.svga" loops="0" clearsafterstop="true"  class="svga svga${i}" style="display: ${res.inMic ? 'block' : 'none'};"></div>
+                            <div class="nameBox">
+                                <p>${res.nick.length > 7 ? `${res.nick.slice(0, 7)}...` : res.nick}
+                                    <span class="${res.gender == 1 ? 'boy' : 'girl'}"><img src="./images/${res.gender == 1 ? 'boy' : 'girl'}.png" alt=""></span>
+                                </p>
+                                <div class="icon">
+                                    <img src="${experImgUrl + `${res.experSeq <= 9 ? '0' + res.experSeq : res.experSeq}.png`}" alt="">
+                                    <img src="${charmImgUrl + `${res.charmSeq <= 9 ? '0' + res.charmSeq : res.charmSeq}.png`}" alt="">
+                                </div>
+                            </div>
+                            <div class="right" style=display:${res.assist ? 'block' : 'none'}>
+                                <img src="${res.assist ? res.assist.avatar : './images/logo.png'}" alt="">
+                                <div class="nick">${res.assist ? res.assist.nick : ''}</div>
+                                <p>最佳助力</p>
+                            </div>
+                            <div class="score">
+                                <b>${unitProcessing((arrAll[0 + 2].totalNum - res.totalNum), 10000, 1, 'W')}</b><br>
+                                <i>距上一名</i>
+                            </div>
+                        </li>`
+                })
+                $('.list').append(str);
+                notTop3.forEach((res, i) => {
+                    var player = new SVGA.Player(`.svga${i}`);
+                    var parser = new SVGA.Parser(`.svga${i}`); // 如果你需要支持 IE6+，那么必须把同样的选择器传给 Parser。
+                    parser.load('./images/live.svga', function (videoItem) {
+                        // 创建动画   
+                        player.setVideoItem(videoItem);
+                        // 开始动画 后面api会讲到   
+                        player.startAnimation();
+                    })
+                })
+
+                // 处理自己榜单
+                $('.my .num').text(res.data.me.seqNo ? res.data.me.seqNo : '未上榜');
+                $('.my .tx').attr('src', res.data.me.avatar);
+                $('.my .p').text(res.data.me.nick);
+                $('.my .score b').text(unitProcessing(res.data.me.totalNum, 10000, 1, 'W'));
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+
+// 获取上期榜单接口
+function getlastTop (type, datetype) {
+    showLoading()
+    networkRequest({
+        type: 'GEt',
+        url: urlPrefix + '/allrank/last/top3',
+        data: { type, datetype, uid: pubInfo.uid },
+        success (res) {
+            if (res.code === 200) {
+                var top3 = res.data.rankVoList.slice(0, 3);
+                // 处理前三
+                if (top3.length < 3) {
+                    let arr = new Array(3 - top3.length).fill({
+                        avatar: './images/logo.png',
+                        nick: '虚位以待',
+                        totalNum: "",
+                        gender: '',
+                        assist: {
+                            avatar: './images/logo.png'
+                        }
+                    })
+                    top3.push(...arr)
+                }
+                top3.forEach((res, i) => {
+                    console.log(res.nick);
+                    if (res.nick == '虚位以待') {
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon`).hide();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} i`).hide();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon_gh`).hide();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} p span`).hide();
+                        console.log('123');
+                    } else {
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} p span img`).show();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon`).show();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} i`).show();
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon_gh`).show();
+                    }
+                    if (listType == 3 || listType == 2) {
+                        $('.lastTopThree .lastTopThree_in .box .no .icon_gh').show();
+                    } else {
+                        $('.lastTopThree .lastTopThree_in .box .no .icon_gh').hide();
+                    }
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon_gh`).attr('src', res.assist ? res.assist.avatar : './images/logo.png')
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .ts`).attr('uid', res.uid);
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .ts`).attr('inRoomUid', res.inRoomUid);
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} p`).html(`${res.nick.length > 6 ? `${res.nick.slice(0, 6)}...` : res.nick}<span class="${res.gender == 1 ? 'boy' : 'girl'}"  style="display:${res.nick == '虚位以待' ? 'none' : 'inline-block'};"><img src="./images/${res.gender == 1 ? 'boy' : 'girl'}.png" alt=""></span>`);
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon .icon1`).attr('src', experImgUrl + `${res.experSeq <= 9 ? '0' + res.experSeq : res.experSeq}.png`);
+                    $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .icon .icon2`).attr('src', charmImgUrl + `${res.charmSeq <= 9 ? '0' + res.charmSeq : res.charmSeq}.png`);
+
+                    if (res.inMic) {
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .svga`).show();
+                    } else {
+                        $(`.lastTopThree .lastTopThree_in .box .no${i + 1} .svga`).hide();
+                    }
+                })
+                $('.lastTopThree').show();
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 获取工会榜单接口
+function clanListRank () {
+    $('.list li').remove();
+    showLoading()
+    networkRequest({
+        type: 'GEt',
+        url: urlPrefix + '/clan/listRank',
+        success (res) {
+            if (res.code === 200) {
+                // 处理前三
+                var top3 = res.data.slice(0, 3);
+                if (top3.length < 3) {
+                    let arr = new Array(3 - top3.length).fill({
+                        avatar: './images/logo.png',
+                        name: '虚位以待',
+                    })
+                    top3.push(...arr);
+                }
+                top3.forEach((res, i) => {
+                    $(`.header .topBox .no${i + 1} .ts`).attr('uid', res.uid);
+                    $(`.header .topBox .no${i + 1} .ts`).attr('inRoomUid', res.inRoomUid);
+                    $(`.header .topBox .no${i + 1} .ts`).attr('inMic', res.inMic);
+                    $(`.header .topBox .no${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.header .topBox .no${i + 1} .icon_gh`).attr('src', res.levelIcon);
+                    $(`.header .topBox .no${i + 1} p`).html(`${res.name.length > 6 ? `${res.name.slice(0, 6)}...` : res.name}<span class="${res.gender == 1 ? 'boy' : 'girl'}"><img src="./images/${res.gender == 1 ? 'boy' : 'girl'}.png" alt=""></span>`);
+                    $(`.header .topBox .no${i + 1} .icon .icon1`).attr('src', experImgUrl + `${res.experSeq <= 9 ? '0' + res.experSeq : res.experSeq}.png`);
+                    $(`.header .topBox .no${i + 1} .icon .icon2`).attr('src', charmImgUrl + `${res.charmSeq <= 9 ? '0' + res.charmSeq : res.charmSeq}.png`);
+                    if (i >= 1) {
+                        $(`.header .topBox .no${i + 1} i`).text(`距上一名${unitProcessing((top3[i - 1].totalNum - res.totalNum), 10000, 1, 'W')}`);
+                    }
+                    if (res.inMic) {
+                        $(`.header .topBox .no${i + 1} .svga`).show();
+                    } else {
+                        $(`.header .topBox .no${i + 1} .svga`).hide();
+                    }
+                })
+                // 处理非前三
+                var notTop3 = res.data.slice(3);
+                var str = '';
+                notTop3.forEach((res, i) => {
+                    str += `
+                        <li>
+                            <div class="num">${i + 4}</div>
+                            <img src="${res.avatar}" alt="" class="tx" uid="${res.uid}" inRoomUid = '${res.inRoomUid}' inMic="${res.inMic}" ">
+                            <div src="./images/live.svga" loops="0" clearsAfterStop="true" class="svga" style="display: ${res.inMic ? 'block' : 'none'};"></div>
+                            <div class="nameBox">
+                                <p>${res.name.length > 7 ? `${res.name.slice(0, 7)}...` : res.name}
+                                    <span class="${res.gender == 1 ? 'boy' : 'girl'}"><img src="./images/${res.gender == 1 ? 'boy' : 'girl'}.png" alt=""></span>
+                                </p>
+                            </div>
+                            <img style="display: block;" src="${res.levelIcon}" alt="" class="icon_gh">
+                        </li>`
+                })
+                $('.list').append(str);
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 榜单切换按钮
+$('.header .tab div').click(function () {
+    var i = $(this).index() + 1;
+    listType = i;
+    $('.header .timeTab div').css('color', 'rgba(255, 255, 255, 0.9)');
+    $('.header .tab div').removeClass('active1').removeClass('active2').removeClass('active3').removeClass('active4');
+    $('.header .tab div').eq(i - 1).addClass(`active${i}`);
+    $('.header .timeTab div').removeClass('divBg1').removeClass('divBg2').removeClass('divBg3')
+    $('.header .timeTab div').removeClass('active1').removeClass('active2').removeClass('active3').removeClass('active4')
+    $('.header .timeTab div').addClass(`divBg${i}`);
+    $('.header').removeClass('header2').removeClass('header3').removeClass('header4');
+    $('.header .listLast span').removeClass('sp1').removeClass('sp2').removeClass('sp3');
+    $('.header .listLast span').addClass(`sp${i}`)
+    $('.header').addClass(`header${i}`);
+    $('.header .topBox').removeClass('topBox1').removeClass('topBox2').removeClass('topBox3').removeClass('topBox4');
+    $('.header .topBox').addClass(`topBox${i}`);
+    $('.header .listLast').show();
+    $('.my').show();
+    $('.list li .right').hide();
+    $('.header .topBox .no .zl').hide();
+    $('.list li .icon_gh').hide();
+    $('.list li .score').show();
+    $('.list li .nameBox .icon').show();
+    $('.list li .nameBox p span').show();
+    $('.header .topBox .no .icon_gh').hide();
+    $('.header .topBox .no .svga').show()
+    $('.header .topBox .no .icon').show()
+    $('.header .topBox .no p span').show()
+    $('.header .topBox .no i').show()
+    if (i == 1) {
+        $('.my .score i').text('爱意值');
+        type = 2;
+        datetype = 1;
+        getRank(type, datetype);
+    } else if (i == 2) {
+        $('.my .score i').text('魅力值');
+        $('.list li .right').show();
+        $('.header .topBox .no .zl').show();
+        type = 1;
+        datetype = 1;
+        getRank(type, datetype);
+    }
+    if (i == 3) {
+        $('.list li .right').show();
+        $('.header .topBox .no .zl').show();
+        $('.header .timeTab').addClass('timeTab2');
+        $('.header .timeTab').show();
+        $('.header .timeTab div').eq(0).addClass(`active${i}`);
+        $('.header .timeTab div').eq(0).css('color', `${listType == 1 ? '#FF5391' : listType == 2 ? '#A34DFF' : listType == 3 ? '#5C68F2' : ''}`).siblings().css('color', 'rgba(255, 255, 255, 0.9)')
+        $('.my .score i').text('房间值');
+        $('.header .topBox .no p span').hide();
+        type = 3;
+        datetype = 6;
+        getRank(type, datetype);
+    } else if (i == 4) {
+        $('.header .listLast').hide();
+        $('.header .timeTab').hide();
+        $('.header .timeTab div').eq(1).addClass(`active${i}`);
+        $('.my').hide();
+        $('.list li .icon_gh').show();
+        $('.list li .score').hide();
+        $('.list li .nameBox .icon').hide();
+        $('.list li .nameBox p span').hide();
+        $('.header .topBox .no .icon_gh').show();
+        $('.header .topBox .no .svga').hide()
+        $('.header .topBox .no .icon').hide()
+        $('.header .topBox .no p span').hide()
+        $('.header .topBox .no i').hide()
+        clanListRank();
+    } else {
+        $('.header .timeTab').show();
+        $('.header .timeTab').removeClass('timeTab2');
+        $('.header .timeTab div').eq(1).addClass(`active${i}`);
+        $('.header .timeTab div').eq(1).css('color', `${listType == 1 ? '#FF5391' : listType == 2 ? '#A34DFF' : listType == 3 ? '#5C68F2' : ''}`).siblings().css('color', 'rgba(255, 255, 255, 0.9)')
+    }
+    return false;
+})
+// 时间周期榜单切换
+$('.header .timeTab div').click(function () {
+    var i = $(this).index() + 1;
+    console.log(i);
+    $('.header .timeTab div').removeClass('active1').removeClass('active2').removeClass('active3').removeClass('active4')
+    $('.header .timeTab div').eq(i - 1).addClass(`active${i}`);
+    $(this).css('color', `${listType == 1 ? '#FF5391' : listType == 2 ? '#A34DFF' : listType == 3 ? '#5C68F2' : ''}`).siblings().css('color', 'rgba(255, 255, 255, 0.9)')
+    if (i == 1) {
+        datetype = 6;
+    } else if (i == 2) {
+        datetype = 1;
+    } else if (i == 3) {
+        datetype = 2;
+    } else if (i == 4) {
+        datetype = 5;
+    };
+    getRank(type, datetype);
+})
+// 关闭上期前三
+$('.lastTopThree').click(function () {
+    $('.lastTopThree').hide();
+})
+// 打开上期前三
+$('.header .listLast').click(function () {
+    getlastTop(type, datetype);
+})
+// 点击前三按钮
+$('.header .topBox .no .ts').on('click', function () {
+    return;
+    var uid = $(this).attr('uid');
+    var inRoomUid = $(this).attr('inRoomUid');
+    var inMic = $(this).attr('inMic');
+    if (listType == 4) {
+        console.log('工会');
+        return
+    }
+    if (listType == 3) {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openRoom.postMessage(uid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openRoom(uid);
+            }
+        }
+        console.log('房间3', uid, inRoomUid, inMic);
+    } else if (inMic == "true") {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openRoom.postMessage(inRoomUid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openRoom(inRoomUid);
+            }
+        }
+        console.log('房间', uid, inRoomUid, inMic);
+    } else {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openPersonPage.postMessage(uid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openPersonPage(uid);
+            }
+        }
+        console.log('信息页', uid, inRoomUid, inMic);
+    }
+
+})
+// 点击非前三按钮
+$('.list').on('click', 'li .tx', function () {
+    return;
+    var uid = $(this).attr('uid');
+    var inRoomUid = $(this).attr('inRoomUid');
+    var inMic = $(this).attr('inMic');
+    if (listType == 4) {
+        console.log('工会');
+        return
+    }
+    if (listType == 3) {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openRoom.postMessage(uid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openRoom(uid);
+            }
+        }
+        console.log('房间3', uid, inRoomUid, inMic);
+    } else if (inMic == "true") {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openRoom.postMessage(inRoomUid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openRoom(inRoomUid);
+            }
+        }
+        console.log('房间', uid, inRoomUid, inMic);
+    } else {
+        if (browser.ios) {
+            window.webkit.messageHandlers.openPersonPage.postMessage(uid);
+        } else if (browser.android) {
+            if (androidJsObj && typeof androidJsObj === 'object') {
+                window.androidJsObj.openPersonPage(uid);
+            }
+        }
+        console.log('信息页', uid, inRoomUid, inMic);
+    }
+
+})

view/yinmeng/modules/report/css/index.css

@@ -0,0 +1,163 @@
+html,
+body {
+  width: 100%;
+  background: #2E5FEC;
+  overflow-x: hidden;
+}
+
+.layui-m-layershade {
+  background-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+.box {
+  width: 10rem;
+  margin: 0 auto;
+  display: block;
+}
+
+.form {
+  width: 9.2rem;
+  border-radius: 0.26667rem;
+  background: #fff;
+  margin: -0.2rem auto 0.66667rem;
+  position: relative;
+  padding: 0.26667rem 0.26667rem;
+  box-sizing: border-box;
+}
+
+.form .title {
+  width: 100%;
+  color: #e21e1e;
+  font-size: 0.42667rem;
+  font-weight: bold;
+  margin-bottom: 0.26667rem;
+}
+
+.form .content {
+  color: #5f5f5f;
+  font-size: 0.37333rem;
+  line-height: 0.53333rem;
+  margin-bottom: 0.4rem;
+}
+
+.form p {
+  color: #474646;
+  font-size: 0.37333rem;
+  margin-bottom: 0.26667rem;
+}
+
+.form p b {
+  color: red;
+  font-weight: bold;
+}
+
+.form p i {
+  font-style: normal;
+  font-size: 0.24rem;
+}
+
+.form .textarea {
+  width: 100%;
+  background: #ccc;
+  border-radius: 0.26667rem;
+  display: block;
+  height: 2rem;
+  box-sizing: border-box;
+  padding: 0.26667rem;
+  font-size: 0.32rem;
+  text-align: left;
+  color: #1a1a1a;
+  background: whitesmoke;
+  outline: none;
+  border: none;
+  resize: none;
+  margin-bottom: 0.26667rem;
+}
+
+.form .textarea2 {
+  width: 100%;
+  background: #ccc;
+  border-radius: 0.26667rem;
+  display: block;
+  height: 1rem;
+  box-sizing: border-box;
+  padding: 0.26667rem;
+  font-size: 0.32rem;
+  text-align: left;
+  color: #1a1a1a;
+  background: whitesmoke;
+  outline: none;
+  border: none;
+  resize: none;
+  margin-bottom: 0.26667rem;
+}
+
+.form .inform-img {
+  margin-bottom: 0.26667rem;
+}
+
+.form .inform-img .inform-img-title {
+  color: #666666;
+  font-size: 14px;
+}
+
+.form .inform-img .box {
+  margin-top: 0.53333rem;
+  display: flex;
+}
+
+.form .inform-img .box .update_evidence {
+  overflow: hidden;
+  border-radius: 0.26667rem;
+  width: 2.13333rem;
+  height: 2.13333rem;
+  margin-right: 0.2rem;
+  position: relative;
+}
+
+.form .inform-img .box .update_evidence.has-data .reupdate {
+  display: block;
+}
+
+.form .inform-img .box .update_evidence input {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  opacity: 0;
+  cursor: pointer;
+}
+
+.form .inform-img .box .update_evidence img {
+  width: 100%;
+  height: 100%;
+}
+
+.form .inform-img .box .update_evidence .reupdate {
+  width: 100%;
+  height: 0.53333rem;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.6);
+  color: white;
+  font-size: 12px;
+  text-align: center;
+  line-height: 0.53333rem;
+  z-index: 2;
+  display: none;
+}
+
+.form .but {
+  width: 80%;
+  margin: 0.4rem auto 0;
+  height: 1.2rem;
+  line-height: 1.2rem;
+  border-radius: 1.2rem;
+  text-align: center;
+  color: #1a1a1a;
+  background: #ffeb3b;
+  font-size: 0.4rem;
+  font-weight: bold;
+}

view/yinmeng/modules/report/css/index.scss

@@ -0,0 +1,170 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: #2E5FEC;
+    overflow-x: hidden;
+}
+
+.layui-m-layershade {
+    background-color: rgba(0, 0, 0, .3) !important;
+}
+
+.box {
+    width: px2rem(750);
+    margin: 0 auto;
+    display: block;
+}
+
+.form {
+    width: 9.2rem;
+    // height: 5rem;
+    border-radius: px2rem(20);
+    background: #fff;
+    margin: px2rem(-15) auto px2rem(50);
+    position: relative;
+    padding: px2rem(20) px2rem(20);
+    box-sizing: border-box;
+
+    .title {
+        width: 100%;
+        color: rgb(226, 30, 30);
+        font-size: px2rem(32);
+        font-weight: bold;
+        margin-bottom: px2rem(20);
+    }
+
+    .content {
+        color: #5f5f5f;
+        font-size: px2rem(28);
+        line-height: px2rem(40);
+        margin-bottom: px2rem(30);
+    }
+
+    p {
+        color: #474646;
+        font-size: px2rem(28);
+        margin-bottom: px2rem(20);
+
+        b {
+            color: red;
+            font-weight: bold;
+        }
+
+        i {
+            font-style: normal;
+            font-size: px2rem(18);
+        }
+    }
+
+    .textarea {
+        width: 100%;
+        background: #ccc;
+        border-radius: px2rem(20);
+        display: block;
+        height: 2rem;
+        box-sizing: border-box;
+        padding: px2rem(20);
+        font-size: px2rem(24);
+        text-align: left;
+        color: #1a1a1a;
+        background: rgba(245, 245, 245, 1);
+        outline: none;
+        border: none;
+        resize: none;
+        margin-bottom: px2rem(20);
+    }
+
+    .textarea2 {
+        width: 100%;
+        background: #ccc;
+        border-radius: px2rem(20);
+        display: block;
+        height: 1rem;
+        box-sizing: border-box;
+        padding: px2rem(20);
+        font-size: px2rem(24);
+        text-align: left;
+        color: #1a1a1a;
+        background: rgba(245, 245, 245, 1);
+        outline: none;
+        border: none;
+        resize: none;
+        margin-bottom: px2rem(20);
+    }
+
+    .inform-img {
+        margin-bottom: px2rem(20);
+
+        .inform-img-title {
+            color: #666666;
+            font-size: 14px;
+        }
+
+        .box {
+            margin-top: px2rem(40);
+            display: flex;
+
+            .update_evidence {
+                overflow: hidden;
+                border-radius: px2rem(20);
+                width: px2rem(160);
+                height: px2rem(160);
+                margin-right: px2rem(15);
+                position: relative;
+
+                &.has-data {
+                    .reupdate {
+                        display: block;
+                    }
+                }
+
+                input {
+                    position: absolute;
+                    width: 100%;
+                    height: 100%;
+                    left: 0;
+                    top: 0;
+                    opacity: 0;
+                    cursor: pointer;
+                }
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
+
+                .reupdate {
+                    width: 100%;
+                    height: px2rem(40);
+                    position: absolute;
+                    left: 0;
+                    bottom: 0;
+                    background-color: rgba(0, 0, 0, 0.6);
+                    color: white;
+                    font-size: 12px;
+                    text-align: center;
+                    line-height: px2rem(40);
+                    z-index: 2;
+                    display: none;
+                }
+            }
+        }
+    }
+
+    .but {
+        width: 80%;
+        margin: px2rem(30) auto 0;
+        height: 1.2rem;
+        line-height: 1.2rem;
+        border-radius: 1.2rem;
+        text-align: center;
+        color: #1a1a1a;
+        background: #ffeb3b;
+        font-size: px2rem(30);
+        font-weight: bold;
+    }
+}

view/yinmeng/modules/report/index.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>举报</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <img src="./images/bg.png" alt="" class="box">
+    <div class="form">
+        <div class="title">重要提醒:</div>
+        <div class="content">如果您发现有不法分子通过平台进行违规操作，请您务必向我们进行反馈，可在下发填写相关信息，或在我的-联系客服反馈，感谢您的理解与支持!</div>
+        <p><b>*</b>请简单描述您遇到的问题:</p>
+        <textarea name="textarea" placeholder="请输入举报内容" class="textarea"></textarea>
+        <p><b>*</b>请填写被举报人ID:</p>
+        <textarea name="textarea" placeholder="被举报人ID" class="textarea2"></textarea>
+        <p><b>*</b>请上传截图，包含被举报人信息<i></i>:</p>
+        <div class="inform-img">
+            <p class="inform-img-title">上传截图&nbsp;(图片不能超过1M)</p>
+            <div class="box">
+                <div class="update_evidence">
+                    <img src="images/report_uploading_img.png" alt="">
+                    <input class="update-img" type="file" accept="image/*">
+                    <div class="reupdate">重新上传
+                        <input class="reupdate-img" type="file" accept="image/*">
+                    </div>
+                </div>
+                <div class="update_evidence">
+                    <img src="images/report_uploading_img.png" alt="">
+                    <input class="update-img" type="file" accept="image/*">
+                    <div class="reupdate">重新上传
+                        <input class="reupdate-img" type="file" accept="image/*">
+                    </div>
+                </div>
+                <div class="update_evidence">
+                    <img src="images/report_uploading_img.png" alt="">
+                    <input class="update-img" type="file" accept="image/*">
+                    <div class="reupdate">重新上传
+                        <input class="reupdate-img" type="file" accept="image/*">
+                    </div>
+                </div>
+            </div>
+        </div>
+        <p style="font-size: 0.3rem;text-align: center;">需要至少上传一张相关截图，以提高举报的准确度</p>
+        <div class="but">提交</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="./js/index.js"></script>

view/yinmeng/modules/report/js/index.js

@@ -0,0 +1,129 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+// 初始化函数
+$(function () {
+    getInfoFromClient();
+})
+// 上传图片
+function upload (than, type) {
+    showLoading();
+    var val = than.get(0).files[0];
+    var formData = new FormData();
+    formData.append('uid', pubInfo.uid);
+    formData.append('file', val);
+    networkRequest({
+        type: 'post',
+        url: urlPrefix + '/live/upload',
+        processData: false,
+        contentType: false,
+        data: formData,
+        success (res) {
+            if (res.code === 200) {
+                if (type == 1) {
+                    than.siblings('img').attr('src', res.data);
+                    than.parent().addClass('has-data')
+                    than.hide();
+                }
+                else {
+                    than.parent().siblings('img').attr('src', res.data);
+                    than.parent().parent().addClass('has-data');
+                }
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 上传按钮
+$('.update_evidence').on('change', '.update-img', function () {
+    var _that = $(this);
+    upload(_that, 1);
+})
+// 重新上传按钮
+$('.update_evidence').on('change', '.reupdate-img', function () {
+    var _that = $(this);
+    upload(_that, 2);
+})
+// 提交按钮
+$('.but').click(function () {
+    var reason = $('.form .textarea').val();
+    var targetUid = $('.form .textarea2').val();
+    var imgStr = '';
+    for (var i = 0; i < $('.update_evidence').length; i++) {
+        if ($('.update_evidence').eq(i).find('img').attr('src').match('images/report_uploading_img.png')) {
+            continue;
+        }
+        if (i < $('.update_evidence').length) {
+            imgStr += ',' + $('.update_evidence').eq(i).find('img').attr('src');
+        }
+    }
+    if (imgStr.indexOf(',') == 0) {
+        imgStr = imgStr.substr(1, imgStr.length);
+    }
+    if (reason == '') {
+        toastMsg('请简单描述您遇到的问题');
+    } else if (targetUid == '') {
+        toastMsg('请填写被举报人ID');
+    } else if (imgStr == '') {
+        toastMsg('需要至少上传一张相关截图');
+    } else {
+        impeachSomeone(reason, targetUid, imgStr);
+    }
+})
+// 提交举报接口
+function impeachSomeone (reason, targetUid, imgStr) {
+    showLoading();
+    networkRequest({
+        type: 'post',
+        url: urlPrefix + '/impeach/impeachSomeone',
+        data: {
+            uid: pubInfo.uid,
+            reason: reason,
+            imgUrl: imgStr,
+            targetErBanNo: targetUid
+        },
+        success (res) {
+            if (res.code === 200) {
+                toastMsg('提交成功')
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}

view/yinmeng/modules/roomRank/css/index.css

@@ -0,0 +1,544 @@
+html,
+body {
+  width: 100%;
+  background: linear-gradient(0deg, #020B27 0%, #1D181B 99%);
+  backdrop-filter: blur(0px);
+  overflow: hidden;
+}
+
+.back {
+  position: fixed;
+  top: 0.26667rem;
+  left: 0.32rem;
+  z-index: 99;
+  width: 0.82667rem;
+  height: 0.82667rem;
+}
+
+.back img {
+  width: 100%;
+  height: 100%;
+}
+
+.back p {
+  color: #fff;
+  font-size: 0.42667rem;
+  position: absolute;
+  width: 9rem;
+  left: 0;
+  top: 0;
+  height: 100%;
+  text-align: center;
+  line-height: 0.82667rem;
+}
+
+.largestBox {
+  width: 10rem;
+  min-height: 15.38667rem;
+  background: url(../images/bg.png) no-repeat;
+  background-size: 10rem 15.38667rem;
+  margin: 0 auto;
+  position: relative;
+  box-sizing: border-box;
+  padding: 1.2rem 0 0 0;
+}
+
+.largestBox .title {
+  width: 7.06667rem;
+  height: 1.14667rem;
+  position: absolute;
+  top: -0.14667rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.largestBox .tab {
+  width: 3.65333rem;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  display: flex;
+  justify-content: space-between;
+  margin: 0 auto 0;
+}
+
+.largestBox .tab div {
+  position: relative;
+  color: rgba(255, 255, 255, 0.7);
+  font-size: 0.37333rem;
+  font-weight: 600;
+}
+
+.largestBox .tab div span {
+  background: none;
+  width: 0.32rem;
+  height: 0.08rem;
+  border-radius: 0.08rem;
+  position: absolute;
+  bottom: -0.10667rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.largestBox .tab .tabColor1 {
+  color: #fff;
+  font-size: 0.37333rem;
+}
+
+.largestBox .tab .tabColor1 span {
+  background: #FA7814;
+}
+
+.largestBox .tab .tabColor2 {
+  color: #fff;
+}
+
+.largestBox .tab .tabColor2 span {
+  background: #A34DFF;
+}
+
+.largestBox .dayTab {
+  width: 5.33333rem;
+  height: 0.61333rem;
+  margin: 0.34667rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+
+.largestBox .dayTab div {
+  width: 1.33333rem;
+  height: 0.61333rem;
+  line-height: 0.61333rem;
+  border-radius: 0.61333rem;
+  text-align: center;
+  color: rgba(255, 255, 255, 0.7);
+  background: rgba(210, 172, 252, 0.4);
+  font-size: 0.32rem;
+  font-weight: 500;
+}
+
+.largestBox .dayTab .dayTabColor1 {
+  background: #fff;
+  color: #FA7814;
+}
+
+.largestBox .dayTab .dayTabColor2 {
+  background: #fff;
+  color: #A34DFF;
+}
+
+.largestBox .top3 {
+  width: 8.8rem;
+  height: 0.01333rem;
+  margin: 3.04rem auto 0;
+  position: relative;
+}
+
+.largestBox .top3 .no1 {
+  width: 3.17333rem;
+  height: 2.88rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: -2.88rem;
+}
+
+.largestBox .top3 .no1 .box {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+
+.largestBox .top3 .no1 .box .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.largestBox .top3 .no1 .box .tx {
+  width: 2.08rem;
+  height: 2.08rem;
+  position: absolute;
+  left: 50%;
+  top: 0.58667rem;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.largestBox .top3 .no1 .box p {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  bottom: -0.56rem;
+  text-align: center;
+}
+
+.largestBox .top3 .no1 .box p span {
+  vertical-align: middle;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+}
+
+.largestBox .top3 .no1 .box p .sp {
+  width: 0.37333rem;
+  height: 0.37333rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.largestBox .top3 .no1 .box p .sp img {
+  display: inline-block;
+  width: 0.21333rem;
+  height: 0.21333rem;
+  border-radius: 50%;
+  margin: 0.06667rem auto 0;
+}
+
+.largestBox .top3 .no1 .box p .boy {
+  background: #6BB3FF;
+}
+
+.largestBox .top3 .no1 .box p .woman {
+  background: #FF80CC;
+}
+
+.largestBox .top3 .no1 .box .icon {
+  width: 100%;
+  height: 0.48rem;
+  position: absolute;
+  left: 0;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  bottom: -1.12rem;
+  padding: 0 0.6rem;
+}
+
+.largestBox .top3 .no1 .box .icon img {
+  display: block;
+  width: 0.96rem;
+  height: 0.48rem;
+}
+
+.largestBox .top3 .no1 .box .score {
+  width: 100%;
+  text-align: center;
+  color: #FFDA24;
+  font-size: 0.32rem;
+  font-weight: 500;
+  position: absolute;
+  left: 0;
+  bottom: -1.53333rem;
+}
+
+.largestBox .top3 .no2 {
+  width: 2.66667rem;
+  height: 2.37333rem;
+  position: absolute;
+  left: 0;
+  top: -2.4rem;
+}
+
+.largestBox .top3 .no2 .box {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+
+.largestBox .top3 .no2 .box .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.largestBox .top3 .no2 .box .tx {
+  width: 1.70667rem;
+  height: 1.70667rem;
+  position: absolute;
+  left: 50%;
+  top: 0.45333rem;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.largestBox .top3 .no2 .box p {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  bottom: -0.56rem;
+  text-align: center;
+}
+
+.largestBox .top3 .no2 .box p span {
+  vertical-align: middle;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+}
+
+.largestBox .top3 .no2 .box p .sp {
+  width: 0.37333rem;
+  height: 0.37333rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.largestBox .top3 .no2 .box p .sp img {
+  display: inline-block;
+  width: 0.21333rem;
+  height: 0.21333rem;
+  border-radius: 50%;
+  margin: 0.06667rem auto 0;
+}
+
+.largestBox .top3 .no2 .box p .boy {
+  background: #6BB3FF;
+}
+
+.largestBox .top3 .no2 .box p .woman {
+  background: #FF80CC;
+}
+
+.largestBox .top3 .no2 .box .icon {
+  width: 100%;
+  height: 0.48rem;
+  position: absolute;
+  left: 0;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  bottom: -1.12rem;
+  padding: 0 0.33333rem;
+}
+
+.largestBox .top3 .no2 .box .icon img {
+  display: block;
+  width: 0.96rem;
+  height: 0.48rem;
+}
+
+.largestBox .top3 .no2 .box .score {
+  width: 100%;
+  text-align: center;
+  color: #FFDA24;
+  font-size: 0.32rem;
+  font-weight: 500;
+  position: absolute;
+  left: 0;
+  bottom: -1.53333rem;
+}
+
+.largestBox .top3 .no3 {
+  width: 2.66667rem;
+  height: 2.37333rem;
+  position: absolute;
+  right: 0;
+  top: -2.4rem;
+}
+
+.largestBox .top3 .no3 .box {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+
+.largestBox .top3 .no3 .box .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.largestBox .top3 .no3 .box .tx {
+  width: 1.70667rem;
+  height: 1.70667rem;
+  position: absolute;
+  left: 50%;
+  top: 0.45333rem;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.largestBox .top3 .no3 .box p {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  bottom: -0.56rem;
+  text-align: center;
+}
+
+.largestBox .top3 .no3 .box p span {
+  vertical-align: middle;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+}
+
+.largestBox .top3 .no3 .box p .sp {
+  width: 0.37333rem;
+  height: 0.37333rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.largestBox .top3 .no3 .box p .sp img {
+  display: inline-block;
+  width: 0.21333rem;
+  height: 0.21333rem;
+  border-radius: 50%;
+  margin: 0.06667rem auto 0;
+}
+
+.largestBox .top3 .no3 .box p .boy {
+  background: #6BB3FF;
+}
+
+.largestBox .top3 .no3 .box p .woman {
+  background: #FF80CC;
+}
+
+.largestBox .top3 .no3 .box .icon {
+  width: 100%;
+  height: 0.48rem;
+  position: absolute;
+  left: 0;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  bottom: -1.12rem;
+  padding: 0 0.33333rem;
+}
+
+.largestBox .top3 .no3 .box .icon img {
+  display: block;
+  width: 0.96rem;
+  height: 0.48rem;
+}
+
+.largestBox .top3 .no3 .box .score {
+  width: 100%;
+  text-align: center;
+  color: #FFDA24;
+  font-size: 0.32rem;
+  font-weight: 500;
+  position: absolute;
+  left: 0;
+  bottom: -1.53333rem;
+}
+
+.largestBox ul {
+  width: 9.57333rem;
+  height: 7.70667rem;
+  margin: 1.81333rem auto 0;
+  background: rgba(255, 167, 141, 0.16);
+  border-radius: 0.42667rem 0.42667rem 0px 0px;
+  border: 0.02667rem solid rgba(255, 217, 115, 0.5);
+  backdrop-filter: blur(7px);
+  border-bottom: none;
+  box-sizing: border-box;
+  padding: 0.21333rem 0 1.86667rem;
+  overflow-y: scroll;
+}
+
+.largestBox ul::-webkit-scrollbar {
+  display: none;
+}
+
+.largestBox ul li {
+  width: 100%;
+  height: 1.92rem;
+  box-sizing: border-box;
+  padding: 0 0.33333rem;
+  overflow: hidden;
+}
+
+.largestBox ul li .num {
+  width: 0.53333rem;
+  height: 100%;
+  line-height: 1.92rem;
+  text-align: center;
+  color: #E6ECF5;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  float: left;
+  margin-right: 0.16rem;
+}
+
+.largestBox ul li .tx {
+  display: block;
+  float: left;
+  width: 1.28rem;
+  height: 1.28rem;
+  border-radius: 1.28rem;
+  margin-top: 0.32rem;
+  margin-right: 0.21333rem;
+}
+
+.largestBox ul li .userInfo {
+  width: 2.8rem;
+  float: left;
+}
+
+.largestBox ul li .userInfo p {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  margin-top: 0.4rem;
+  margin-bottom: 0.10667rem;
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 500;
+}
+
+.largestBox ul li .userInfo img {
+  display: inline-block;
+  width: 0.96rem;
+  height: 0.48rem;
+  margin-right: 0.10667rem;
+}
+
+.largestBox ul li .score {
+  float: right;
+  text-align: right;
+}
+
+.largestBox ul li .score p {
+  color: #E6ECF5;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  margin-top: 0.48rem;
+  margin-bottom: 0.06667rem;
+}
+
+.largestBox ul li .score span {
+  color: #B1B5BD;
+  font-size: 0.29333rem;
+  font-weight: 400;
+  display: block;
+}
+
+.layui-m-layershade {
+  background-color: transparent !important;
+}
+
+.layui-m-layer2 .layui-m-layerchild {
+  width: 3rem !important;
+  height: 3rem !important;
+  border: none !important;
+  box-shadow: none !important;
+  color: #fff !important;
+  background: rgba(0, 0, 0, 0.6) !important;
+}
+
+.layui-m-layer2 .layui-m-layercont {
+  text-align: center !important;
+  padding: 0 !important;
+  line-height: 0 !important;
+  margin-top: 0.8rem !important;
+}

view/yinmeng/modules/roomRank/css/index.scss

@@ -0,0 +1,552 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: linear-gradient(0deg, #020B27 0%, #1D181B 99%);
+    backdrop-filter: blur(0px);
+    // background: #0B1836;
+    overflow: hidden;
+}
+
+.back {
+    position: fixed;
+    top: px2rem(20);
+    left: px2rem(24);
+    z-index: 99;
+    width: px2rem(62);
+    height: px2rem(62);
+
+    img {
+        width: 100%;
+        height: 100%;
+    }
+
+    p {
+        color: #fff;
+        font-size: px2rem(32);
+        position: absolute;
+        width: 9rem;
+        left: 0;
+        top: 0;
+        height: 100%;
+        text-align: center;
+        line-height: px2rem(62);
+    }
+}
+
+.largestBox {
+    width: px2rem(750);
+    min-height: px2rem(1154);
+    background: url(../images/bg.png) no-repeat;
+    background-size: px2rem(750) px2rem(1154);
+    margin: 0 auto;
+    position: relative;
+    box-sizing: border-box;
+    padding: px2rem(90) 0 0 0;
+
+    .title {
+        width: px2rem(530);
+        height: px2rem(86);
+        position: absolute;
+        top: px2rem(-11);
+        left: 50%;
+        transform: translateX(-50%);
+    }
+
+    .tab {
+        width: px2rem(274);
+        height: px2rem(40);
+        line-height: px2rem(40);
+        display: flex;
+        justify-content: space-between;
+        margin: 0 auto 0;
+
+        div {
+            position: relative;
+            color: rgba(255, 255, 255, .7);
+            font-size: px2rem(28);
+            font-weight: 600;
+
+            span {
+                background: none;
+                width: px2rem(24);
+                height: px2rem(6);
+                border-radius: px2rem(6);
+                position: absolute;
+                bottom: px2rem(-8);
+                left: 50%;
+                transform: translateX(-50%);
+            }
+        }
+
+        .tabColor1 {
+            color: #fff;
+            font-size: px2rem(28);
+
+            span {
+                background: #FA7814;
+            }
+        }
+
+        .tabColor2 {
+            color: #fff;
+
+            span {
+                background: #A34DFF;
+            }
+        }
+    }
+
+    .dayTab {
+        width: px2rem(400);
+        height: px2rem(46);
+        margin: px2rem(26) auto 0;
+        display: flex;
+        justify-content: space-between;
+
+        div {
+            width: px2rem(100);
+            height: px2rem(46);
+            line-height: px2rem(46);
+            border-radius: px2rem(46);
+            text-align: center;
+            color: rgba(255, 255, 255, .7);
+            background: rgba(210, 172, 252, .4);
+            font-size: px2rem(24);
+            font-weight: 500;
+        }
+
+        .dayTabColor1 {
+            background: #fff;
+            color: #FA7814;
+        }
+
+        .dayTabColor2 {
+            background: #fff;
+            color: #A34DFF;
+        }
+    }
+
+    .top3 {
+        width: px2rem(660);
+        height: px2rem(1);
+        margin: px2rem(228) auto 0;
+        position: relative;
+
+        .no1 {
+            width: px2rem(238);
+            height: px2rem(216);
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: px2rem(-216);
+
+            .box {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+
+                .ts {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 0;
+                    top: 0;
+                    z-index: 2;
+                }
+
+                .tx {
+                    width: px2rem(156);
+                    height: px2rem(156);
+                    position: absolute;
+                    left: 50%;
+                    top: px2rem(44);
+                    // top: px2rem(34);
+                    transform: translateX(-50%);
+                    border-radius: 50%;
+                }
+
+                p {
+                    width: 100%;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-42);
+                    text-align: center;
+
+                    span {
+                        vertical-align: middle;
+                        color: #E6ECF5;
+                        font-size: px2rem(28);
+                    }
+
+                    .sp {
+                        width: px2rem(28);
+                        height: px2rem(28);
+                        border-radius: 50%;
+                        display: inline-block;
+
+                        img {
+                            display: inline-block;
+                            width: px2rem(16);
+                            height: px2rem(16);
+                            border-radius: 50%;
+                            margin: px2rem(5) auto 0;
+                        }
+                    }
+
+                    .boy {
+                        background: #6BB3FF;
+                    }
+
+                    .woman {
+                        background: #FF80CC;
+                    }
+
+                }
+
+                .icon {
+                    width: 100%;
+                    height: px2rem(36);
+                    position: absolute;
+                    left: 0;
+                    display: flex;
+                    justify-content: space-between;
+                    box-sizing: border-box;
+                    bottom: px2rem(-84);
+                    padding: 0 px2rem(45);
+
+                    img {
+                        display: block;
+                        width: px2rem(72);
+                        height: px2rem(36);
+                    }
+                }
+
+                .score {
+                    width: 100%;
+                    text-align: center;
+                    color: #FFDA24;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-115);
+                }
+            }
+        }
+
+        .no2 {
+            width: px2rem(200);
+            height: px2rem(178);
+            position: absolute;
+            left: 0;
+            top: px2rem(-180);
+
+            .box {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+
+                .ts {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 0;
+                    top: 0;
+                    z-index: 2;
+                }
+
+                .tx {
+                    width: px2rem(128);
+                    height: px2rem(128);
+                    position: absolute;
+                    left: 50%;
+                    top: px2rem(34);
+                    transform: translateX(-50%);
+                    border-radius: 50%;
+                }
+
+                p {
+                    width: 100%;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-42);
+                    text-align: center;
+
+                    span {
+                        vertical-align: middle;
+                        color: #E6ECF5;
+                        font-size: px2rem(28);
+                    }
+
+                    .sp {
+                        width: px2rem(28);
+                        height: px2rem(28);
+                        border-radius: 50%;
+                        display: inline-block;
+
+                        img {
+                            display: inline-block;
+                            width: px2rem(16);
+                            height: px2rem(16);
+                            border-radius: 50%;
+                            margin: px2rem(5) auto 0;
+                        }
+                    }
+
+                    .boy {
+                        background: #6BB3FF;
+                    }
+
+                    .woman {
+                        background: #FF80CC;
+                    }
+
+                }
+
+                .icon {
+                    width: 100%;
+                    height: px2rem(36);
+                    position: absolute;
+                    left: 0;
+                    display: flex;
+                    justify-content: space-between;
+                    box-sizing: border-box;
+                    bottom: px2rem(-84);
+                    padding: 0 px2rem(25);
+
+                    img {
+                        display: block;
+                        width: px2rem(72);
+                        height: px2rem(36);
+                    }
+                }
+
+                .score {
+                    width: 100%;
+                    text-align: center;
+                    color: #FFDA24;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-115);
+                }
+            }
+        }
+
+        .no3 {
+            width: px2rem(200);
+            height: px2rem(178);
+            position: absolute;
+            right: 0;
+            top: px2rem(-180);
+
+            .box {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+
+                .ts {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 0;
+                    top: 0;
+                    z-index: 2;
+                }
+
+                .tx {
+                    width: px2rem(128);
+                    height: px2rem(128);
+                    position: absolute;
+                    left: 50%;
+                    top: px2rem(34);
+                    transform: translateX(-50%);
+                    border-radius: 50%;
+                }
+
+                p {
+                    width: 100%;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-42);
+                    text-align: center;
+
+                    span {
+                        vertical-align: middle;
+                        color: #E6ECF5;
+                        font-size: px2rem(28);
+                    }
+
+                    .sp {
+                        width: px2rem(28);
+                        height: px2rem(28);
+                        border-radius: 50%;
+                        display: inline-block;
+
+                        img {
+                            display: inline-block;
+                            width: px2rem(16);
+                            height: px2rem(16);
+                            border-radius: 50%;
+                            margin: px2rem(5) auto 0;
+                        }
+                    }
+
+                    .boy {
+                        background: #6BB3FF;
+                    }
+
+                    .woman {
+                        background: #FF80CC;
+                    }
+
+                }
+
+                .icon {
+                    width: 100%;
+                    height: px2rem(36);
+                    position: absolute;
+                    left: 0;
+                    display: flex;
+                    justify-content: space-between;
+                    box-sizing: border-box;
+                    bottom: px2rem(-84);
+                    padding: 0 px2rem(25);
+
+                    img {
+                        display: block;
+                        width: px2rem(72);
+                        height: px2rem(36);
+                    }
+                }
+
+                .score {
+                    width: 100%;
+                    text-align: center;
+                    color: #FFDA24;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    position: absolute;
+                    left: 0;
+                    bottom: px2rem(-115);
+                }
+            }
+        }
+    }
+
+    ul {
+        width: px2rem(718);
+        height: px2rem(578);
+        margin: px2rem(136) auto 0;
+        background: rgba(255, 167, 141, 0.16);
+        border-radius: px2rem(32) px2rem(32) 0px 0px;
+        border: px2rem(2) solid rgba(255, 217, 115, 0.5);
+        backdrop-filter: blur(7px);
+        border-bottom: none;
+        box-sizing: border-box;
+        padding: px2rem(16) 0 px2rem(140);
+        overflow-y: scroll;
+        &::-webkit-scrollbar{
+            display: none;
+        }
+
+        li {
+            width: 100%;
+            height: px2rem(144);
+            box-sizing: border-box;
+            padding: 0 px2rem(25);
+            overflow: hidden;
+
+            .num {
+                width: px2rem(40);
+                height: 100%;
+                line-height: px2rem(144);
+                text-align: center;
+                color: #E6ECF5;
+                font-size: px2rem(32);
+                font-weight: 500;
+                float: left;
+                margin-right: px2rem(12);
+            }
+
+            .tx {
+                display: block;
+                float: left;
+                width: px2rem(96);
+                height: px2rem(96);
+                border-radius: px2rem(96);
+                margin-top: px2rem(24);
+                margin-right: px2rem(16);
+            }
+
+            .userInfo {
+                width: px2rem(210);
+                float: left;
+
+                p {
+                    width: 100%;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    margin-top: px2rem(30);
+                    margin-bottom: px2rem(8);
+                    color: #E6ECF5;
+                    font-size: px2rem(28);
+                    font-weight: 500;
+                }
+
+                img {
+                    display: inline-block;
+                    width: px2rem(72);
+                    height: px2rem(36);
+                    margin-right: px2rem(8);
+                }
+            }
+
+            .score {
+                float: right;
+                text-align: right;
+
+                p {
+                    color: #E6ECF5;
+                    font-size: px2rem(28);
+                    font-weight: 600;
+                    margin-top: px2rem(36);
+                    margin-bottom: px2rem(5);
+                }
+
+                span {
+                    color: #B1B5BD;
+                    font-size: px2rem(22);
+                    font-weight: 400;
+                    display: block;
+                }
+            }
+        }
+    }
+}
+
+.layui-m-layershade {
+    background-color: rgba(0, 0, 0, .0) !important;
+}
+
+.layui-m-layer2 .layui-m-layerchild {
+    width: 3rem !important;
+    height: 3rem !important;
+    border: none !important;
+    box-shadow: none !important;
+    color: #fff !important;
+    background: rgba(0, 0, 0, .6) !important;
+}
+
+.layui-m-layer2 .layui-m-layercont {
+    text-align: center !important;
+    padding: 0 !important;
+    line-height: 0 !important;
+    margin-top: 0.8rem !important;
+}