动画问题

src/components/annual-summary/card-1.vue

@@ -8,10 +8,10 @@
       <p v-if="anualData.doctorName" class="title">
         尊敬的
         <span
-          class="shareanimate"
-          swiper-animate-effect="shareanimate"
+          swiper-animate-effect="fadeInUp"
           swiper-animate-duration="4s"
-          swiper-animate-delay="0s"
+          swiper-animate-delay="0.5s"
+          class="ani"
         >{{anualData.doctorName | shortName(5)}}</span>医生
       </p>
       <p v-if="!anualData.doctorName" class="title">

src/components/annual-summary/card-2.vue

 <template>
   <div class="card-2-wrapper">
     <Logo></Logo>
-    <div class="bgi-wrapper"><img src="~@/images/annual/page-2-back.png" alt="" /></div>
+    <div class="bgi-wrapper">
+      <img src="~@/images/annual/page-2-back.png" alt />
+    </div>
     <section class="detail">
       <div id="detail-content">
-        <p >{{anualData.yearType}}年，您一共学习了</p>
-        <p class="mt-10"><span class="fbig6 cg2">{{anualData.loginTotalTimeM}}</span>  分钟</p>
-        <p v-show="anualData.learnCourseNum" ><span class="fbig6 cg2">{{anualData.learnCourseNum}}</span>  课程</p>
-        <p v-show="anualData.learnArticleNum"><span class="fbig6 cg2">{{anualData.learnArticleNum}}</span>  文章</p>
+        <p>{{anualData.yearType}}年，您一共学习了</p>
+        <p class="mt-10">
+          <span
+            class="ani fbig6 cg2"
+            swiper-animate-effect="fadeInUp"
+            swiper-animate-duration="4s"
+            swiper-animate-delay="0.5s"
+          >{{anualData.loginTotalTimeM}}</span> 分钟
+        </p>
+        <p v-show="anualData.learnCourseNum">
+          <span class="fbig6 cg2">{{anualData.learnCourseNum}}</span> 课程
+        </p>
+        <p v-show="anualData.learnArticleNum">
+          <span class="fbig6 cg2">{{anualData.learnArticleNum}}</span> 文章
+        </p>
         <p v-show="anualData.learnMoreCourseLabelName" class="mt-5">您最关注的学科</p>
-        <p v-show="anualData.learnMoreCourseLabelName" class="cg2 b">{{anualData.learnMoreCourseLabelName | shortName(10)}}</p>
+        <p
+          v-show="anualData.learnMoreCourseLabelName"
+          class="cg2 b"
+        >{{anualData.learnMoreCourseLabelName | shortName(10)}}</p>
       </div>
-    </section>    
+    </section>
   </div>
 </template>
 <script>
@@ -27,8 +43,8 @@ export default {
         return {};
       }
     }
-  },
-}
+  }
+};
 </script>
 <style lang="less" scoped>
 @import "../../style/as-common.less";
@@ -38,8 +54,8 @@ export default {
   left: 0;
   height: 100vh;
   font-size: 16px;
-  color: #3B3B3B;
-  background: #F4FEF8;
+  color: #3b3b3b;
+  background: #f4fef8;
   .bgi-wrapper {
     position: absolute;
     bottom: 0;

src/views/annual-summary/detail.vue

@@ -52,7 +52,7 @@ export default {
   },
   data() {
     return {
-      token: "5EE5FA068BD646C687239ED119377185",
+      token: "",
       isWeb: window.__isWeb,
       isInfresh: false,
       showLoading: false,
@@ -104,10 +104,11 @@ export default {
       _this.getUserInfo();
     };
 
-    _this.getUserInfo();
   },
 
-  mounted() {},
+  mounted() {
+    _this.getUserInfo();
+  },
 
   methods: {
     ...mapActions(["setUserInfo"]),
@@ -115,7 +116,7 @@ export default {
     // 获取数据
     initData() {
       let param = {
-        token: this.token || "A0774D88168047CC9BE57B8BAB4F6F50",
+        token: this.token || "4E1CABA5AC404B9ABF331376CE178A9C",
         yearType: "2020",
         setEntry: true
       };