1.开屏动画修改2.数字人播报修改

src/view/home/index.vue

@@ -1,8 +1,8 @@
 <template>
-  <div>
+  <div class="no-scroll">
     <div v-if="page2">
-      <div id="book" class="book" >
+      <div id="book" class="book">
-        <div class="page1">
+        <div class="page1" @click="startAutoTurn">
           <img src="/public/static/book.jpg" style="width: 100%;height: 100%;">
         </div>
         <div class="page2"></div>
@@ -193,13 +193,13 @@ export default {
   //   console.log('Component deactivated++++++++++++++++');
   // },
   mounted() {
-    var page=sessionStorage.getItem('page');
+    var page = sessionStorage.getItem('page');
-    if(page==1){
+    if (page == 1) {
-        this.page2=false;
+      this.page2 = false;
-    }else{
+    } else {
       this.onTurn();
     }
-    
+
     //window.addEventListener('popstate', this.handlePopState);
     console.log(this.data);
     if (this.$route.query) {
@@ -415,6 +415,7 @@ export default {
     },
 
     onTurn() {
+      var that = this;
       this.$nextTick(() => {
         $('#book').turn({
           acceleration: true, //启用硬件加速,移动端有效
@@ -425,12 +426,21 @@ export default {
           autoCenter: true, //
           turnCorners: 'br', // 设置可翻页的页角(都试过了，乱写 4个角都能出发卷起)， bl,br   tl,tr   bl,tr 
           height: '100vh', //页面高度
-          width: '100%' //翻书范围宽度，总宽度
+          width: '100%', //翻书范围宽度，总宽度
+          when: {
+            last: function (e, page) {
+              console.log('last');
+              setTimeout(() => {
+                that.page2 = false;
+                sessionStorage.setItem('page', 1);
+              }, 1000)
+            },
+          }
         });
         // 添加自动翻页功能
-        setTimeout(() => {
+        // setTimeout(() => {
-          this.startAutoTurn();
+        //   this.startAutoTurn();
-        }, 1500)
+        // }, 2000)
 
       })
     },
@@ -440,7 +450,7 @@ export default {
       book.turn('next');
       setTimeout(() => {
         this.page2 = false;
-        sessionStorage.setItem('page',1);
+        sessionStorage.setItem('page', 1);
       }, 1000)
 
     },
@@ -548,4 +558,8 @@ div[id^=reader-helper] {
 .super_copy_btns_btn:active {
   opacity: 1
 }
+
+.no-scroll {
+  overflow: hidden;
+}
 </style>

src/view/home/info.vue

@@ -9,7 +9,7 @@
     <!-- <div style="padding: 10px 0px;" v-if="activeDate.video != '' && activeDate.video != null">
       <video :src="activeDate.video" controls style="width: 100%;max-height: 300px;margin: 0px auto;"></video>
     </div> -->
-    <div style="margin-top: 15px;">
+    <div style="margin-top: 15px;" v-if="activeDate.video != '' && activeDate.video != null">
       <img src="/public/static/top_video.png" @click="showModal = true" style="width: 100%;">
     </div>
     <div id="imgBox" :class="'font' + fontSize" style="line-height: 30px;" v-html="activeDate.content"></div>
@@ -18,12 +18,15 @@
     </div> -->
 
     <div id="PageBtn">
-      <div style="position: fixed;bottom: 290px;right: 15px;z-index: 100;">
+      <div style="position: fixed;bottom: 290px;right: 20px;z-index: 100;">
         <div id="read-btn" @click="readMp3()">
-          <img v-if="!isPlay" src="/public/static/stop.png" style="width: 50px;height: 50px;">
+          <img v-if="!isPlay" src="/public/static/voice_pause.png" style="width: 40px;height: 40px;">
-          <img v-if="isPlay" src="/public/static/bf.gif" style="width: 50px;height: 50px;">
+          <img v-if="isPlay" src="/public/static/voice_play.png" style="width: 40px;height: 40px;">
         </div>
       </div>
+      <div v-if="isPlay" style="position: fixed;bottom: 40px;left: 10px;">
+        <img src="/public/static/bf.gif" style="width: 80px;height: 100%;">
+      </div>
       <div class="MenuBox">
         <a id="Haibao_share" @click="copy()" href="javascript:(-1);"
           style="background-image: url(/h5/public/static/share.png);background-position: center;background-repeat: repeat;"></a>
@@ -81,7 +84,6 @@ const copy = () => {
 const audioPlayer = ref(null);
 const isPlay = ref(false);
 const readMp3 = () => {
-  console.log(audioPlayer.value.error);
   if (audioPlayer.value.error != null) {
     alert('音频生成中，请稍候再试！');
     return;