From fe52c75b42ef2815dc5c66e964c2b388ed09d097 Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期五, 25 四月 2025 11:28:21 +0800
Subject: [PATCH] 环境变量修改

---
 src/books/artAndDrama/view/components/index.vue |  132 ++++++++++++++++++++++++++++++-------------
 1 files changed, 92 insertions(+), 40 deletions(-)

diff --git a/src/books/artAndDrama/view/components/index.vue b/src/books/artAndDrama/view/components/index.vue
index 5f82a27..3a5e736 100644
--- a/src/books/artAndDrama/view/components/index.vue
+++ b/src/books/artAndDrama/view/components/index.vue
@@ -3,25 +3,52 @@
     <div id="searchDomBox" style="display: none">
       <div id="searchContent"></div>
     </div>
-    <div class="page-content" :style="{
-      fontSize: fontSize ? fontSize + 'px' : '16px',
-      transform: `scale(${pageZoom ? pageZoom : 1})`,
-      transformOrigin: 'center top',
-    }">
-      <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader>
-      <chapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" ></chapterOne>
-      <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList"></chapterTwo>
-      <chapterThree v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList"></chapterThree>
-      <chapterFour v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList"></chapterFour>
-      <chapterFive v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList"></chapterFive>
+    <div
+      class="page-content"
+      :style="{
+        fontSize: fontSize ? fontSize + 'px' : '19px',
+        transform: `scale(${pageZoom ? pageZoom : 1})`,
+        transformOrigin: 'center top',
+      }"
+    >
+      <pageHeader
+        v-if="showCatalogList.indexOf(1) > -1"
+        :showPageList="loadPageList"
+      ></pageHeader>
+      <chapterOne
+        v-if="showCatalogList.indexOf(2) > -1"
+        :showPageList="loadPageList"
+      ></chapterOne>
+      <chapterTwo
+        v-if="showCatalogList.indexOf(3) > -1"
+        :showPageList="loadPageList"
+      ></chapterTwo>
+      <chapterThree
+        v-if="showCatalogList.indexOf(4) > -1"
+        :showPageList="loadPageList"
+      ></chapterThree>
+      <chapterFour
+        v-if="showCatalogList.indexOf(5) > -1"
+        :showPageList="loadPageList"
+      ></chapterFour>
+      <chapterFive
+        v-if="showCatalogList.indexOf(6) > -1"
+        :showPageList="loadPageList"
+      ></chapterFive>
     </div>
     <!-- 闊抽灏忕獥鎾斁缁勪欢 -->
-    <miniAudio :path="audioPath" :currentTime="currentTime" @closeMiniAudio="closeMiniAudio" ref="audioPlayer">
+    <miniAudio
+      :path="audioPath"
+      :currentTime="currentTime"
+      @closeMiniAudio="closeMiniAudio"
+      ref="audioPlayer"
+    >
     </miniAudio>
   </div>
 </template>
 
 <script>
+import Vue from "vue";
 import pageHeader from "./header.vue";
 import chapterOne from "./chapter001.vue";
 import chapterTwo from "./chapter002.vue";
@@ -160,7 +187,7 @@
 
     // 娴嬭瘯椤甸潰璺宠浆
     //  setTimeout(() => {
-    //  this.gotoPage(6,38);
+    //  this.gotoPage(5,32);
     //   setTimeout(() => {
     //     this.renderSign("Highlight", {
     //       id: "2ACA9359",
@@ -188,7 +215,7 @@
     //   txt: " 杩愬姩绯荤粺鏄敱楠ㄣ�侀杩炵粨鍜岄楠艰倢涓夐儴鍒嗙粍鎴愮殑銆傚叏韬殑楠ㄩ�氳繃楠ㄨ繛缁撶粍鎴愪汉浣撻楠硷紙瑙佸浘1-1锛夈�傞楠兼槸浜轰綋鐨勬敮鏋讹紝鍏锋湁淇濇姢鍐呰剰鍣ㄥ畼銆佷緵鑲岃倝闄勭潃鍜屼綔涓鸿倢鑲夎繍鍔ㄧ殑鏉犳潌绛変綔鐢ㄣ�傚湪绁炵粡绯荤粺鐨勬敮閰嶄笅锛岃倢鑲夋敹缂╃壍鍔ㄦ墍闄勭潃鐨勯缁曠潃鍏宠妭杞姩锛屼娇韬綋浜х敓鍚勭鍔ㄤ綔銆傛墍浠ワ紝杩愬姩绯荤粺鍏锋湁杩愬姩銆佹敮鎸佸拰淇濇姢绛夊姛鑳斤紝骞煎勾鏃舵湡鐨勯楠艰繕鍏锋湁閫犺鍔熻兘銆� ",
     //   txtIndex: 57
     // });
-    //  }, 500);
+    // }, 500);
   },
   methods: {
     // setZoom1() {
@@ -207,6 +234,7 @@
     // },
     // 婊氬姩鐩戝惉
     scrollFun(event) {
+      this.handleVideoPicture()
       // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩
       if (event.target.scrollTop > this.previousScrollTop) {
         this.getAduio();
@@ -312,7 +340,10 @@
           this.container ? this.container : document
         ).querySelector(`[page="${data.page}"]`);
         // 鍒涘缓 createTreeWalker 杩唬鍣紝鐢ㄤ簬閬嶅巻鏂囨湰鑺傜偣锛屼繚瀛樺埌涓�涓暟缁�
-        const treeWalker = document.createTreeWalker(pageDom, NodeFilter.SHOW_TEXT);
+        const treeWalker = document.createTreeWalker(
+          pageDom,
+          NodeFilter.SHOW_TEXT
+        );
         const allTextNodes = [];
         let currentNode = treeWalker.nextNode();
         while (currentNode) {
@@ -444,8 +475,8 @@
           page && pageThemeColor && pageThemeColor[page]
             ? pageThemeColor[page]
             : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
-              ? chapterThemeColor[chapterNum]
-              : bookThemeColor;
+            ? chapterThemeColor[chapterNum]
+            : bookThemeColor;
         if (themeColor) {
           domItem.style.color = themeColor;
         }
@@ -462,8 +493,8 @@
           page && pageThemeColor && pageThemeColor[page]
             ? pageThemeColor[page]
             : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
-              ? chapterThemeColor[chapterNum]
-              : bookThemeColor;
+            ? chapterThemeColor[chapterNum]
+            : bookThemeColor;
         if (themeColor) {
           domItem.style.backgroundColor = themeColor;
         }
@@ -480,8 +511,8 @@
           page && pageThemeColor && pageThemeColor[page]
             ? pageThemeColor[page]
             : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
-              ? chapterThemeColor[chapterNum]
-              : bookThemeColor;
+            ? chapterThemeColor[chapterNum]
+            : bookThemeColor;
         if (themeColor) {
           domItem.style.borderColor = themeColor;
         }
@@ -577,7 +608,10 @@
               // 楂樹寒琛�
               setTimeout(() => {
                 // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣
-                const pageTextList = document.createTreeWalker(target, NodeFilter.SHOW_TEXT);
+                const pageTextList = document.createTreeWalker(
+                  target,
+                  NodeFilter.SHOW_TEXT
+                );
                 // 鍖归厤鍏抽敭瀛�
                 const allPageTextNodes = [];
                 let currentNode = pageTextList.nextNode();
@@ -728,7 +762,7 @@
           propsData: {
             showPageList: [],
             questionData: {},
-            isSearch: true
+            isSearch: true,
           },
         });
         pageExample.$mount(
@@ -760,7 +794,7 @@
               propsData: {
                 showPageList: [pageNum],
                 questionData: {},
-                isSearch: true
+                isSearch: true,
               },
             });
             pageExample.$mount(
@@ -774,7 +808,10 @@
               .querySelector(`[page="${pageNum}"]`);
             if (thisPageDom) {
               // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣
-              const pageTextList = document.createTreeWalker(thisPageDom, NodeFilter.SHOW_TEXT);
+              const pageTextList = document.createTreeWalker(
+                thisPageDom,
+                NodeFilter.SHOW_TEXT
+              );
               // 鍖归厤鍏抽敭瀛�
               const allPageTextNodes = [];
               let currentNode = pageTextList.nextNode();
@@ -813,7 +850,7 @@
       // 璁板綍楂樹寒淇℃伅
       this.highlightData = data;
       // 璺宠浆
-      this.gotoPage(data.catalog, data.page, () => { });
+      this.gotoPage(data.catalog, data.page, () => {});
     },
     // 椤甸潰鍚戜笅婊氬姩锛岄煶棰戝皬绐楁挱鏀惧姛鑳�
     getAduio() {
@@ -867,17 +904,16 @@
       ).querySelectorAll(".audio");
       for (let index = 0; index < allAudio.length; index++) {
         const item = allAudio[index];
-        item.addEventListener('play',() => {
+        item.addEventListener("play", () => {
           const audioList = Array.from(allAudio);
-            for (let cindex = 0; cindex < audioList.length; cindex++) {
+          for (let cindex = 0; cindex < audioList.length; cindex++) {
             const citem = audioList[cindex];
-            if(citem.currentSrc != item.src) {
-              citem.pause()
-              
+            if (citem.currentSrc != item.src) {
+              citem.pause();
             }
           }
-          this.closeMiniAudio()
-        })
+          this.closeMiniAudio();
+        });
       }
     },
     // 鍏抽棴mini video
@@ -891,18 +927,34 @@
       ).querySelectorAll(".video");
       for (let index = 0; index < allVideo.length; index++) {
         const item = allVideo[index];
-        item.addEventListener('playing',(item) => {
-          const path  = item.srcElement.src
+        item.addEventListener("playing", (item) => {
+          const path = item.srcElement.src;
           const videoList = Array.from(allVideo);
           for (let cindex = 0; cindex < videoList.length; cindex++) {
             const citem = videoList[cindex];
-            if(citem.currentSrc != path && path) {
-              citem.pause()
+            if (citem.currentSrc != path && path) {
+              citem.pause();
             }
           }
-        })
+        });
       }
-    }
+    },
+    // 瑙嗛灏忕獥
+    handleVideoPicture() {
+      let doms = (this.container ? this.container : document).querySelectorAll(
+        ".video"
+      );
+      doms = Array.from(doms);
+      if (!doms.length) return false;
+      const playVudio = doms.reverse().find((item) => item.paused == false);
+      if (playVudio) {
+        const bottomGap = playVudio.getBoundingClientRect().bottom;
+        const topGap = playVudio.getBoundingClientRect().top;
+        if (bottomGap < 0 || topGap > window.innerHeight) {
+          playVudio.requestPictureInPicture();
+        }
+      }
+    },
   },
   components: {
     pageHeader,
@@ -929,4 +981,4 @@
     padding-bottom: 100px;
   }
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.9.1