From 6ab7a22865b0f2ce46a7308fa8ae9ef7bc90b1c8 Mon Sep 17 00:00:00 2001
From: Zhang HaoYang <1304907854@qq.com>
Date: Fri, 7 Jul 2023 11:33:05 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Monthly/MonthlyDetail.vue | 54 ++++++++++++++----------
 src/components/Ranking/Ranking.vue       | 12 ++++--
 2 files changed, 40 insertions(+), 26 deletions(-)

diff --git a/src/components/Monthly/MonthlyDetail.vue b/src/components/Monthly/MonthlyDetail.vue
index afabbfc..7c56ecd 100644
--- a/src/components/Monthly/MonthlyDetail.vue
+++ b/src/components/Monthly/MonthlyDetail.vue
@@ -129,16 +129,17 @@ export default {
 
     },
     mounted() {
-        window.addEventListener('scroll', this.onScroll);
-        window.addEventListener('scroll', this.scrollToTop);
-        this.initPage();
         this.getMonely();
+        this.initPage();
         this.FreshItems();
+        // window.addEventListener('scroll',this.scrollToTop);
+        window.addEventListener('scroll',this.onScroll);
     },
     destroy() {
         // 必须移除监听器，不然当该vue组件被销毁了，监听器还在就会出错
-        window.removeEventListener('scroll', this.onScroll);
         window.removeEventListener('scroll', this.scrollToTop);
+        window.removeEventListener('scroll', this.onScroll);
+
     },
     computed:{
         noMore() {
@@ -156,27 +157,35 @@ export default {
     },
     methods: {
         backTop () {
-            const that = this
-            let timer = setInterval(() => {
-                let ispeed = Math.floor(-that.scrollTop / 5)
-                document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + ispeed
-                if (that.scrollTop === 0) {
-                    clearInterval(timer)
+            let top = document.documentElement.scrollTop || document.body.scrollTop;
+            // 实现滚动效果
+            const timeTop = setInterval(() => {
+                document.body.scrollTop = document.documentElement.scrollTop = top -= 50;
+                if (top <= 0) {
+                    clearInterval(timeTop);
                 }
-            }, 16)
-        },
+            }, 10);
 
-        // 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
-        scrollToTop () {
-            const that = this
-            let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
-            that.scrollTop = scrollTop
-            if (that.scrollTop > 60) {
-                that.btnFlag = true
-            } else {
-                that.btnFlag = false
-            }
+            // const that = this
+            // let timer = setInterval(() => {
+            //     let ispeed = Math.floor(-that.scrollTop / 5)
+            //     document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + ispeed
+            //     if (that.scrollTop === 0) {
+            //         clearInterval(timer)
+            //     }
+            // }, 16)
         },
+        // // 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
+        // scrollToTop () {
+        //     const that = this
+        //     let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
+        //     that.scrollTop = scrollTop
+        //     if (that.scrollTop > 60) {
+        //         that.btnFlag = true
+        //     } else {
+        //         that.btnFlag = false
+        //     }
+        // },
         //滚动
         // 点击切换锚点：
         goAnchor(id) {
@@ -265,6 +274,7 @@ export default {
                     that.MonType.push(key);
                     that.MonTypePro.push(that.MonList[key]);
                 })
+                console.log(that.MonList);
             })
         },
         // 月刊详情页面跳转
diff --git a/src/components/Ranking/Ranking.vue b/src/components/Ranking/Ranking.vue
index efad09c..126068a 100644
--- a/src/components/Ranking/Ranking.vue
+++ b/src/components/Ranking/Ranking.vue
@@ -3,10 +3,10 @@
         <div style="display: flex;flex-direction:column;flex-wrap: nowrap">
             <div class="PageHeader">
                 <br/>
-                <el-page-header  @back="goBack" style="justify-content: center;">
+                <el-page-header  @back="goBack" style="justify-content:left;display: flex;">
                     <div slot="title" style="font-size:23px;font-weight: 600;"></div>
-                    <div slot="content" style="font-size:23px;font-weight: 600;">
-                        HelloGitHub (2023)年语言排行榜
+                    <div slot="content" class="test" style="font-size:23px;font-weight: 600;">
+                        <div>(2023)年(1)季度语言排行榜</div>
                     </div>
                 </el-page-header>
             </div>
@@ -91,8 +91,12 @@ export default {
 
 <style scoped lang="scss">
 ::v-deep .el-page-header__left{
-  left:-150px;
+  left:10px;
 }
+::v-deep .el-page-header__content{
+    flex:1;
+}
+
 .el-card{
     border: none;
 }