From 69f2f8148c766837bd4229827f3122a7767869a8 Mon Sep 17 00:00:00 2001
From: xuyiming <xuyiming@bd-apaas.com>
Date: Thu, 16 Jul 2020 17:15:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BA=94=E7=94=A8=E9=83=A8=E7=BD=B2=E6=8E=92?=
 =?UTF-8?q?=E5=90=8D=E5=88=86=E6=9E=90=E8=87=AA=E5=8A=A8=E8=BD=AE=E6=92=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/e-charts/toplist.vue | 51 ++++++++++++++++++++++++++++-
 1 file changed, 50 insertions(+), 1 deletion(-)

diff --git a/src/components/e-charts/toplist.vue b/src/components/e-charts/toplist.vue
index 4167965..1c7253e 100644
--- a/src/components/e-charts/toplist.vue
+++ b/src/components/e-charts/toplist.vue
@@ -1,5 +1,9 @@
 <template>
-  <div class="top_list apass_scroll">
+  <div
+    class="top_list apass_scroll"
+    @mouseenter="mouseenter"
+    @mouseleave="mouseleave"
+  >
     <ul>
       <li class="item_list" v-for="(option, index) in options" :key="index">
         <div class="item_index">
@@ -40,10 +44,55 @@ export default {
       default: () => 1000,
     },
   },
+  data() {
+    return {
+      timer: null,
+    };
+  },
+  watch: {
+    text() {
+      this.autoScroll();
+    },
+  },
   methods: {
     getPercent(value) {
       return Math.min((value / this.targetValue) * 100, 100);
     },
+    autoScroll() {
+      if (this.timer) {
+        clearInterval(this.timer);
+      }
+
+      this.$el.scrollTop = 0;
+
+      this.timer = setInterval(() => {
+        let curScrollTop = this.$el.scrollTop + 1;
+        if (curScrollTop > this.$el.scrollHeight - this.$el.clientHeight) {
+          curScrollTop = 0;
+        }
+        this.$el.scrollTop = curScrollTop;
+      }, 50);
+    },
+    mouseenter() {
+      if (this.timer) {
+        clearInterval(this.timer);
+      }
+    },
+    mouseleave() {
+      this.autoScroll();
+    },
+  },
+  mounted() {
+    this.autoScroll();
+
+    window.addEventListener("resize", () => {
+      this.autoScroll();
+    });
+  },
+  destroyed() {
+    if (this.timer) {
+      clearInterval(this.timer);
+    }
   },
 };
 </script>
-- 
2.26.0