BUG修复

src/components/GroupPraise.vue

@@ -2,13 +2,18 @@
   <div class="group-praise">
     <!-- 广播 -->
     <div class="group-praise__broadcast">
-      <i class="group-praise__broadcast--icon icon_transport transport-laba1"></i>
+      <i
+        class="group-praise__broadcast--icon icon_transport transport-laba1"
+      ></i>
       <div class="group-praise__broadcastListWrap">
-        <ul class="group-praise__broadcastList" :class="{marquee_top:animate}" :style="{transform:'translateY('+(0.375*n)+'rem)'}">
-          <li
-            v-for="(item,i) in evaluateUserList"
-            :key="i"
-          >【{{item[0]}}】支助人员「{{item[1]}}」 {{item[2]}}</li>
+        <ul
+          class="group-praise__broadcastList"
+          :class="{ marquee_top: animate }"
+          :style="{ transform: 'translateY(' + 0.375 * n + 'rem)' }"
+        >
+          <li v-for="(item, i) in evaluateUserList" :key="i">
+            【{{ item[0] }}】支助人员「{{ item[1] }}」 {{ item[2] }}
+          </li>
         </ul>
       </div>
     </div>
@@ -16,22 +21,34 @@
       <div class="group-praise__circle">
         <header class="group-praise__title">NO.2</header>
         <div class="group-praise__circleContent" v-if="gradeRankingList[1]">
-          <p class="group-praise__circleName ellipsis">{{gradeRankingList[1][1]}}</p>
-          <p class="group-praise__circlePercent">{{gradeRankingList[1][0]}}</p>
+          <p class="group-praise__circleName ellipsis">
+            {{ gradeRankingList[1][1] }}
+          </p>
+          <p class="group-praise__circlePercent">
+            {{ gradeRankingList[1][0] }}
+          </p>
         </div>
       </div>
       <div class="group-praise__circle--win">
         <header class="group-praise__title">NO.1</header>
         <div class="group-praise__circleContent" v-if="gradeRankingList[0]">
-          <p class="group-praise__circleName ellipsis">{{gradeRankingList[0][1]}}</p>
-          <p class="group-praise__circlePercent">{{gradeRankingList[0][0]}}</p>
+          <p class="group-praise__circleName ellipsis">
+            {{ gradeRankingList[0][1] }}
+          </p>
+          <p class="group-praise__circlePercent">
+            {{ gradeRankingList[0][0] }}
+          </p>
         </div>
       </div>
       <div class="group-praise__circle">
         <header class="group-praise__title">NO.3</header>
         <div class="group-praise__circleContent" v-if="gradeRankingList[2]">
-          <p class="group-praise__circleName ellipsis">{{gradeRankingList[2][1]}}</p>
-          <p class="group-praise__circlePercent">{{gradeRankingList[2][0]}}</p>
+          <p class="group-praise__circleName ellipsis">
+            {{ gradeRankingList[2][1] }}
+          </p>
+          <p class="group-praise__circlePercent">
+            {{ gradeRankingList[2][0] }}
+          </p>
         </div>
       </div>
     </div>
@@ -39,14 +56,14 @@
 </template>
 
 <script>
-import { post, timer2 } from './../http/http'
+import { post, timer2 } from "./../http/http";
 export default {
-  name: 'GroupPraise',
-  inject: ['hospitalId'],
-  data () {
+  name: "GroupPraise",
+  inject: ["hospitalId"],
+  data() {
     return {
       allData: {},
-      fontSize: parseFloat(document.querySelector('html').style.fontSize),
+      fontSize: parseFloat(document.querySelector("html").style.fontSize),
       timer: null,
       animate: false,
       timer1: null,
@@ -56,60 +73,65 @@ export default {
       disY: 0.375, // 滚动数据偏移量
       disHeight: 0, // 滚动数据高度
       isShow: true // 滚动数据显示隐藏
-    }
+    };
   },
   methods: {
     // 无限滚动
-    scrollInfinite () {
-      clearTimeout(this.timer1)
+    scrollInfinite() {
+      clearTimeout(this.timer1);
       this.timer1 = setTimeout(() => {
-        this.showMarquee()
-        this.scrollInfinite()
-      }, 2000)
+        this.showMarquee();
+        this.scrollInfinite();
+      }, 2000);
     },
     // 处理数组方法
-    showMarquee () {
-      this.animate = true
-      this.n--
-      if (this.n === -(this.evaluateUserList.length)) {
-        this.animate = false
-        this.n = 0
+    showMarquee() {
+      this.animate = true;
+      this.n--;
+      if (this.n === -this.evaluateUserList.length) {
+        this.animate = false;
+        this.n = 0;
       }
     },
     // 近30天小组好评排行
-    async getGroupPraise () {
+    async getGroupPraise() {
       const srartTime = this.$moment()
-        .subtract(1, 'days')
-        .format('YYYY-MM-DD') // 昨日
-      const endTime = this.$moment().format('YYYY-MM-DD') // 今天
+        .subtract(1, "days")
+        .format("YYYY-MM-DD"); // 昨日
+      const endTime = this.$moment()
+        .subtract(1, "days")
+        .format("YYYY-MM-DD"); // 昨日
       const result = await post(
         `/largeScreen/getData/gradeRanking/${this.hospitalId}`,
         { srartTime, endTime, pageSize: 3 }
-      )
-      this.gradeRankingList = result.gradeRankingList
-      this.evaluateUserList = result.evaluateUserList
-      this.polling()
+      );
+      this.gradeRankingList = result.gradeRankingList;
+      this.evaluateUserList = result.evaluateUserList;
+      this.polling();
       if (this.evaluateUserList.length > 0) {
-        this.evaluateUserList = [...this.evaluateUserList, this.evaluateUserList[0]]
-        this.scrollInfinite()
+        this.evaluateUserList = [
+          ...this.evaluateUserList,
+          this.evaluateUserList[0]
+        ];
+        this.scrollInfinite();
       }
     },
     // 轮询请求
-    polling () {
-      clearTimeout(this.timer)
+    polling() {
+      clearTimeout(this.timer);
       this.timer = setTimeout(() => {
-        this.getGroupPraise()
-      }, timer2)
+        this.getGroupPraise();
+      }, timer2);
     }
   },
-  mounted () {
-    this.getGroupPraise()
+  mounted() {
+    this.getGroupPraise();
   },
-  beforeDestroy () {
-    clearTimeout(this.timer)
-    clearTimeout(this.timer1)
+  beforeDestroy() {
+    clearTimeout(this.timer);
+    clearTimeout(this.timer1);
   }
-}
+};
 </script>
 
 <style lang="less">