优化空投池&公司简介

H5/src/utils/bridgeToAppFun.js

@@ -71,7 +71,7 @@ class bridgeToAppFun {
         console.log("返回调用失败，都不行");
       }
     } else {
-      console.log('去调用ios返回');
+      console.log("去调用ios返回");
       jsBridge.callhandler("navigateBack");
     }
   }

H5/src/views/aboutUs.vue

@@ -3,10 +3,10 @@
     <div class="content">
       <p class="paragraph">
         <span class="special">
-          日本西田森制药株式会社坐落在東京都千代田区東神田2丁目6番7号608，以'传递希望，传播爱'为企业理念
+          日本西田森制药株式会社坐落在東京都千代田区東神田2丁目6番7号608，以"传递希望，传播爱"为企业理念
           ,让健康的"希望之光洒向世界每一寸森田"为愿景,开展企业经营活动。其核心业务包括【食品、医药品、保健品、化妆品等研发事业】
           与【医疗健康消费者商品研发事业】研发并生产有助于人类健康的创新产品。
-          西田森将始终保持高度的伦理观，以健康产品为基点，创造新的价值为目标不断发展，从而成为"全球性的价值创造企业"
+          西田森将始终保持高度的伦理观，以健康产品为基点，创造新的价值为目标不断发展，从而成为"全球性的价值创造企业"。
         </span>
       </p>
     </div>

H5/src/views/airDropPool.vue

@@ -14,7 +14,10 @@
         <div class="notice-bar">
           <img src="@/assets/images/icon-notice.png" alt="" />
           <div class="notice-bar-show" id="scroll-box">
-            <div class="user-id-list">
+            <div
+              :class="['user-id-list', canScroll && 'scroll']"
+              :style="canScroll && `animation-duration: ${animationDuration}s`"
+            >
               <p
                 v-for="(item, index) in userPoolVos"
                 :key="index"
@@ -59,6 +62,8 @@ export default {
   name: "AirDrop",
   data() {
     return {
+      animationDuration: 10,
+      canScroll: false,
       currentUser: {},
       userInfoDialog: false,
       total: 0,
@@ -97,8 +102,14 @@ export default {
               item.userId.substring(0, 3) + "****" + item.userId.substring(7);
             return temp;
           });
+          if (_this.userPoolVos.length > 3) {
+            this.canScroll = true;
+            this.animationDuration = _this.userPoolVos.length * 3;
+          }
           _this.$nextTick(() => {
-            _this.scroll();
+            if (_this.canScroll) {
+              _this.scroll();
+            }
           });
         } else {
           _this.$toast(res.msg);
@@ -106,25 +117,28 @@ export default {
       });
     },
     scroll() {
-      this.timer = setInterval(this.autoScrollLine, 100);
-    },
-    autoScrollLine() {
-      let box = document.getElementById("scroll-box");
-      let parent = document.getElementsByClassName("user-id-list")[0];
-      const _this = this;
-      if (box) {
-        if (box.scrollTop != null && box.scrollTop >= parent.offsetHeight) {
-          box.scrollTop = 0;
-        } else {
-          box.scrollTop += 1;
-        }
-        if (box.scrollTop % box.offsetHeight == 0) {
-          clearInterval(_this.timer);
-          box.scrollTop = 0;
-          _this.timer = setInterval(_this.autoScrollLine, 300);
-        }
-      }
+      // this.timer = setInterval(this.autoScrollLine, 100);
+      const marquee = document.querySelector(".user-id-list");
+      const contents = marquee.innerHTML;
+      marquee.innerHTML = contents + contents;
     }
+    // autoScrollLine() {
+    //   let box = document.getElementById("scroll-box");
+    //   let parent = document.getElementsByClassName("user-id-list")[0];
+    //   const _this = this;
+    //   if (box) {
+    //     if (box.scrollTop != null && box.scrollTop >= parent.offsetHeight) {
+    //       box.scrollTop = 0;
+    //     } else {
+    //       box.scrollTop += 1;
+    //     }
+    //     if (box.scrollTop % box.offsetHeight < 1) {
+    //       clearInterval(_this.timer);
+    //       box.scrollTop = 0;
+    //       _this.timer = setInterval(_this.autoScrollLine, 200);
+    //     }
+    //   }
+    // }
   }
 };
 </script>
@@ -227,6 +241,7 @@ $white: #ffffff;
     }
     &::before {
       top: 0;
+      z-index: 1;
     }
     &::after {
       top: 66.66%;
@@ -236,8 +251,26 @@ $white: #ffffff;
       margin-right: 15px;
     }
     .notice-bar-show {
+      width: 100%;
       height: 100%;
-      overflow: scroll;
+      .user-id-list {
+        display: flex;
+        flex-direction: column;
+      }
+      .scroll {
+        animation-name: marquee;
+        animation-timing-function: linear;
+        animation-iteration-count: infinite;
+      }
+
+      @keyframes marquee {
+        0% {
+          transform: translateY(0%);
+        }
+        100% {
+          transform: translateY(-100%);
+        }
+      }
 
       p {
         font-size: 16px;

H5/src/views/grade.vue

@@ -116,16 +116,18 @@ export default {
     getstatus() {
       const userId = JSON.parse(localStorage.getItem("user")).userId;
       const _this = this;
-      getForestStatus(userId).then(res => {
-        if (res.code === 0) {
-          let resData = res.data;
-          _this.handleData(resData);
-        } else {
-          _this.$toast.fail(res.msg);
-        }
-      }).catch(err => {
-        console.log(err);
-      });
+      getForestStatus(userId)
+        .then(res => {
+          if (res.code === 0) {
+            let resData = res.data;
+            _this.handleData(resData);
+          } else {
+            _this.$toast.fail(res.msg);
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
     },
     handleData(data) {
       this.perenct = data.perenct;