From efc4c74c8bdc856d3bbc9a958ff230a197db4044 Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期五, 14 六月 2024 17:51:40 +0800
Subject: [PATCH] 艺术与舞蹈添加音频小窗播放,同时只能播放一个音频两功能

---
 src/books/embedded/view/components/index.vue         |   20 ++--
 src/books/artAndDance/view/components/header.vue     |    4 
 src/books/artAndDance/view/components/chapter003.vue |    7 +
 src/books/artAndDance/view/components/chapter002.vue |    7 +
 src/books/artAndDance/view/components/chapter001.vue |    8 +
 src/books/artAndDance/view/components/chapter004.vue |    7 +
 src/books/artAndDance/view/components/chapter005.vue |    7 +
 src/books/artAndDance/view/components/index.vue      |  104 +++++++++++++++++++++++--
 src/books/mathBook/view/components/index.vue         |   20 ++--
 src/App.vue                                          |    2 
 src/books/English/view/components/index.vue          |   20 ++--
 src/books/artAndDance/assets/main.less               |   19 +---
 12 files changed, 157 insertions(+), 68 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 65f4077..16e08b0 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -65,7 +65,7 @@
         process.env.VUE_APP_RESOURCE_CTX +
           (process.env.VUE_APP_ENV == "product"
             ? process.env.VUE_APP_BOOK_ID
-            : "childHealth")
+            : "artAndDance")
       );
       // 娴嬭瘯璇曡30椤�
       // this.activeBook.tryPageCount = 10;
diff --git a/src/books/English/view/components/index.vue b/src/books/English/view/components/index.vue
index 8722e79..d0b26c3 100644
--- a/src/books/English/view/components/index.vue
+++ b/src/books/English/view/components/index.vue
@@ -628,23 +628,23 @@
           autoplay: {
             //鑷姩寮�濮�
             delay: 3000, //鏃堕棿闂撮殧
-            disableOnInteraction: false, //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
+            disableOnInteraction: false //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
           },
           paginationClickable: true,
           slidesPerView: 1, // 涓�缁勪笁涓�
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
-          observeParents: true,
+          observeParents: true
           // // 濡傛灉闇�瑕佸垎椤靛櫒
           // pagination: {
           //   el: (this.container ? this.container : document).querySelector(
@@ -667,12 +667,12 @@
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
@@ -691,8 +691,8 @@
               var paginationInfoEl = dom.querySelector(".pageBox");
               if (paginationInfoEl)
                 paginationInfoEl.textContent = currentPage + "/" + totalPages;
-            },
-          },
+            }
+          }
         });
       }
     },
diff --git a/src/books/artAndDance/assets/main.less b/src/books/artAndDance/assets/main.less
index 5642906..04ec6c4 100644
--- a/src/books/artAndDance/assets/main.less
+++ b/src/books/artAndDance/assets/main.less
@@ -420,16 +420,6 @@
 }
 
 /* 濯掍綋鏌ヨ鍋氬熀纭�鍝嶅簲寮忓竷灞� */
-@media (max-width: 430px) {
-  .ans-dance  {
-    .page-box {
-      min-height: 750px;
-    }
-    .pg-mh {
-      min-height: 815px;
-    }
-  }
-}
 @media (max-width: 660px) {
   .ans-dance {
     /* 鍒嗛〉padding */
@@ -453,6 +443,12 @@
         margin-top: 10px;
       }
     }
+    .page-box{
+      min-height: 500px;
+    }
+    .pg-mh {
+      min-height: 815px;
+    }
   }
 }
 @media (min-width: 660px) {
@@ -471,9 +467,6 @@
       flex-wrap: nowrap;
       li {
         width: 58%;
-      }
-      li:nth-child(2) {
-        margin-left: 10px;
       }
     }
   }
diff --git a/src/books/artAndDance/view/components/chapter001.vue b/src/books/artAndDance/view/components/chapter001.vue
index 859425a..1306868 100644
--- a/src/books/artAndDance/view/components/chapter001.vue
+++ b/src/books/artAndDance/view/components/chapter001.vue
@@ -4,7 +4,6 @@
       <div v-if="showPageList.indexOf(4) > -1">
         <img class="img-0" alt="" src="../../assets/images/dy1.jpg" />
         <img src="../../assets/images/01.gif" alt="" style="width: 53%;" class="cover-img">
-        <audio></audio>
       </div>
     </div>
     <div class="page-box" page="5">
@@ -55,13 +54,13 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8 ">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20 " >
               <span class="wh-nr auido-text mr-8 ">
                 濂崇闊�
               </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c003">榛勯工妤奸�佸瓱娴╃劧涔嬪箍闄�</h3>
@@ -173,6 +172,9 @@
       this.auidoPathOne = await getResourcePath("2c5f6c69b0f9f7a3c03e473cb8c977f5");
       this.auidoPathTwo = await getResourcePath("e93c0fdde08be5a4386c8c863892a287");
     },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
+    }
   },
 };
 </script>
diff --git a/src/books/artAndDance/view/components/chapter002.vue b/src/books/artAndDance/view/components/chapter002.vue
index 4400f7f..9c77c40 100644
--- a/src/books/artAndDance/view/components/chapter002.vue
+++ b/src/books/artAndDance/view/components/chapter002.vue
@@ -65,13 +65,13 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20">
               <span class="wh-nr auido-text mr-8">
                 濂崇闊�
               </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c006">浜$緤琛ョ墷</h3>
@@ -219,6 +219,9 @@
           this.addNum()
         }
       },200)
+    },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
     }
   },
 };
diff --git a/src/books/artAndDance/view/components/chapter003.vue b/src/books/artAndDance/view/components/chapter003.vue
index 374f78b..0f81d92 100644
--- a/src/books/artAndDance/view/components/chapter003.vue
+++ b/src/books/artAndDance/view/components/chapter003.vue
@@ -54,13 +54,13 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20">
               <span class="wh-nr auido-text mr-8">
                 濂崇闊�
               </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c009">灏忓効鍨傞挀</h3>
@@ -171,6 +171,9 @@
       this.auidoPathOne = await getResourcePath("85923e871441c541991be07fe4ce8771");
       this.auidoPathTwo = await getResourcePath("c018f7a6434abfac0b0e0da1174d643a");
     },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
+    }
   },
   }
 </script>
diff --git a/src/books/artAndDance/view/components/chapter004.vue b/src/books/artAndDance/view/components/chapter004.vue
index b9631f1..2ba2656 100644
--- a/src/books/artAndDance/view/components/chapter004.vue
+++ b/src/books/artAndDance/view/components/chapter004.vue
@@ -60,13 +60,13 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20">
               <span class="wh-nr auido-text mr-8">
                 濂崇闊�
               </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c012">瀵婚殣鑰呬笉閬�</h3>
@@ -175,6 +175,9 @@
       this.auidoPathOne = await getResourcePath("a865ff99b91fa24d87ac81a883be54db");
       this.auidoPathTwo = await getResourcePath("66f3cc00d272a120514201e13e87fb9d");
     },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
+    }
   },
   }
 </script>
diff --git a/src/books/artAndDance/view/components/chapter005.vue b/src/books/artAndDance/view/components/chapter005.vue
index 31c6c3e..0ba88b0 100644
--- a/src/books/artAndDance/view/components/chapter005.vue
+++ b/src/books/artAndDance/view/components/chapter005.vue
@@ -80,11 +80,11 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20">
               <span class="wh-nr auido-text mr-8"> 濂崇闊� </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c015">娓旀瓕瀛�</h3>
@@ -231,6 +231,9 @@
         }
       }, 200);
     },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
+    }
   },
 };
 </script>
diff --git a/src/books/artAndDance/view/components/header.vue b/src/books/artAndDance/view/components/header.vue
index 57aea29..04df044 100644
--- a/src/books/artAndDance/view/components/header.vue
+++ b/src/books/artAndDance/view/components/header.vue
@@ -1,11 +1,11 @@
 <template>
   <div class="chapter" num="1">
-    <div class="page-box mt-20" page="1" style="min-height: auto;">
+    <div class="page-box mt-20" page="1">
       <div v-if="showPageList.indexOf(1) > -1">
         <img class="img-0" alt="" src="../../assets/images/Cover.jpg" />
       </div>
     </div>
-    <div class="page-box" page="2" style="min-height: auto;">
+    <div class="page-box" page="2" >
       <div v-if="showPageList.indexOf(2) > -1">
         <img class="img-0" alt="" src="../../assets/images/SMY.jpg" />
       </div>
diff --git a/src/books/artAndDance/view/components/index.vue b/src/books/artAndDance/view/components/index.vue
index 5574cf3..02232f5 100644
--- a/src/books/artAndDance/view/components/index.vue
+++ b/src/books/artAndDance/view/components/index.vue
@@ -18,30 +18,40 @@
       <chapterOne
         v-if="showCatalogList.indexOf(2) > -1"
         :showPageList="loadPageList"
+        @closeAudio="closeAudio"
       ></chapterOne>
       <chapterTwo
         v-if="showCatalogList.indexOf(3) > -1"
         :showPageList="loadPageList"
+        @closeAudio="closeAudio"
       >
       </chapterTwo>
       <chapterThree
       v-if="showCatalogList.indexOf(4) > -1"
         :showPageList="loadPageList"
+        @closeAudio="closeAudio"
       ></chapterThree>
       <chapterFour
       v-if="showCatalogList.indexOf(5) > -1"
         :showPageList="loadPageList"
+        @closeAudio="closeAudio"
       ></chapterFour>
       <chapterFive
       v-if="showCatalogList.indexOf(6) > -1"
         :showPageList="loadPageList"
+        @closeAudio="closeAudio"
       ></chapterFive>
       <chapterSix
         v-if="showCatalogList.indexOf(7) > -1"
         :showPageList="loadPageList"
       ></chapterSix>
     </div>
-
+    <miniAudio
+      :path="audioPath"
+      :currentTime="currentTime"
+      @closeMiniAudio="closeMiniAudio"
+      ref="audioPlayer"
+    ></miniAudio>
   </div>
 </template>
 
@@ -54,6 +64,7 @@
 import chapterFive from './chapter005.vue'
 import chapterSix from './chapter006.vue'
 import NoteIcon from "@/assets/images/biji.png";
+import miniAudio from "@/components/miniAudio/index.vue";
 import _ from "lodash";
 import Swiper from "swiper/bundle";
 import "swiper/swiper-bundle.css";
@@ -75,6 +86,9 @@
       questionDataMap: {},
       renderSignMap: {},
       highlightData: null,
+      audioPath: "",
+      currentTime: null,
+      videoList: [],
     };
   },
   computed: {
@@ -229,6 +243,7 @@
     scrollFun(event) {
       // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩
       if (event.target.scrollTop > this.previousScrollTop) {
+        this.getAduio()
         // 鍚戜笅
         const currentScrollTop =
           event.target.scrollTop + event.target.offsetHeight;
@@ -252,6 +267,7 @@
           }
         }
       } else if (event.target.scrollTop < this.previousScrollTop) {
+        this.handleAudio()
         // 鍚戜笂
         const currentScrollTop = event.target.scrollTop;
         if (currentScrollTop <= this.loadThreshold) {
@@ -639,23 +655,23 @@
           autoplay: {
             //鑷姩寮�濮�
             delay: 3000, //鏃堕棿闂撮殧
-            disableOnInteraction: false, //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
+            disableOnInteraction: false //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
           },
           paginationClickable: true,
           slidesPerView: 1, // 涓�缁勪笁涓�
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
-          observeParents: true,
+          observeParents: true
           // // 濡傛灉闇�瑕佸垎椤靛櫒
           // pagination: {
           //   el: (this.container ? this.container : document).querySelector(
@@ -678,12 +694,12 @@
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
@@ -702,8 +718,8 @@
               var paginationInfoEl = dom.querySelector(".pageBox");
               if (paginationInfoEl)
                 paginationInfoEl.textContent = currentPage + "/" + totalPages;
-            },
-          },
+            }
+          }
         });
       }
     },
@@ -834,6 +850,71 @@
       // 璺宠浆
       this.gotoPage(data.catalog, data.page, () => {});
     },
+        // 椤甸潰鍚戜笅婊氬姩锛岄煶棰戝皬绐楁挱鏀惧姛鑳�
+    getAduio() {
+      let allVideo = (
+        this.container ? this.container : document
+      ).querySelectorAll(".audio");
+      allVideo = Array.from(allVideo);
+      this.videoList = allVideo;
+      if (allVideo.length) {
+        // 鏌ユ壘鎾斁鐘舵�佺殑鏈�鍚庝竴鏉¢煶棰�
+        const playAudio = allVideo
+          .reverse()
+          .find((item) => item.paused == false);
+        if (playAudio) {
+          const bottomGap = playAudio.getBoundingClientRect().bottom;
+          if (bottomGap < 0) {
+            playAudio.pause();
+            this.audioPath = playAudio.src;
+            this.currentTime = playAudio.currentTime;
+          }
+        }
+      }
+    },
+    // 椤甸潰鍚戜笂婊氬姩锛岄煶棰戝皬绐楀洖鏀�
+    handleAudio() {
+      if (!this.audioPath) return false;
+      let allVideo = (
+        this.container ? this.container : document
+      ).querySelectorAll(".audio");
+      allVideo = Array.from(allVideo);
+      if (allVideo.length) {
+        //鏌ユ壘涓庡皬绐楁挱鏀鹃煶棰戝悓婧愮殑椤甸潰audio DOM
+        const playAudio = allVideo.find((item) => item.src == this.audioPath);
+        if (playAudio) {
+          const bottomGap = playAudio.getBoundingClientRect().bottom;
+          if (bottomGap >= 0) {
+            if (this.$refs.audioPlayer) {
+              const playerState = this.$refs.audioPlayer.getVideoPlayer();
+              this.audioPath = "";
+              playAudio.currentTime = playerState.currentTime;
+              if (!playerState.paused) playAudio.play();
+            }
+          }
+        }
+      }
+    },
+    // 鍏抽棴mini video
+    closeMiniAudio() {
+      this.audioPath = "";
+    },
+    // 鐐瑰嚮闊抽鎾斁锛屽叧闂叾浠栭煶棰�
+    closeAudio(path) {
+      let allVideo = (
+        this.container ? this.container : document
+      ).querySelectorAll(".audio");
+      allVideo = Array.from(allVideo);
+      if(allVideo.length) {
+        for (let index = 0; index < allVideo.length; index++) {
+          const item = allVideo[index];
+          if(item.currentSrc != path) {
+            item.pause()
+          }
+        }
+      }
+      this.closeMiniAudio()
+    }
   },
   components: {
     pageHeader,
@@ -843,6 +924,7 @@
     chapterFour,
     chapterFive,
     chapterSix,
+    miniAudio
   },
 };
 </script>
diff --git a/src/books/embedded/view/components/index.vue b/src/books/embedded/view/components/index.vue
index f187aa3..3c1eeaa 100644
--- a/src/books/embedded/view/components/index.vue
+++ b/src/books/embedded/view/components/index.vue
@@ -610,23 +610,23 @@
           autoplay: {
             //鑷姩寮�濮�
             delay: 3000, //鏃堕棿闂撮殧
-            disableOnInteraction: false, //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
+            disableOnInteraction: false //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
           },
           paginationClickable: true,
           slidesPerView: 1, // 涓�缁勪笁涓�
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
-          observeParents: true,
+          observeParents: true
           // // 濡傛灉闇�瑕佸垎椤靛櫒
           // pagination: {
           //   el: (this.container ? this.container : document).querySelector(
@@ -649,12 +649,12 @@
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
@@ -673,8 +673,8 @@
               var paginationInfoEl = dom.querySelector(".pageBox");
               if (paginationInfoEl)
                 paginationInfoEl.textContent = currentPage + "/" + totalPages;
-            },
-          },
+            }
+          }
         });
       }
     },
diff --git a/src/books/mathBook/view/components/index.vue b/src/books/mathBook/view/components/index.vue
index b135e8a..d608cce 100644
--- a/src/books/mathBook/view/components/index.vue
+++ b/src/books/mathBook/view/components/index.vue
@@ -618,23 +618,23 @@
           autoplay: {
             //鑷姩寮�濮�
             delay: 3000, //鏃堕棿闂撮殧
-            disableOnInteraction: false, //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
+            disableOnInteraction: false //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
           },
           paginationClickable: true,
           slidesPerView: 1, // 涓�缁勪笁涓�
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
-          observeParents: true,
+          observeParents: true
           // // 濡傛灉闇�瑕佸垎椤靛櫒
           // pagination: {
           //   el: (this.container ? this.container : document).querySelector(
@@ -657,12 +657,12 @@
           spaceBetween: 30, // 闂撮殧
           // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
           navigation: {
-            nextEl: (this.container ? this.container : document).querySelector(
+            nextEl: dom.querySelector(
               ".swiper-button-next"
             ),
-            prevEl: (this.container ? this.container : document).querySelector(
+            prevEl: dom.querySelector(
               ".swiper-button-prev"
-            ),
+            )
           },
           // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
           observer: true,
@@ -681,8 +681,8 @@
               var paginationInfoEl = dom.querySelector(".pageBox");
               if (paginationInfoEl)
                 paginationInfoEl.textContent = currentPage + "/" + totalPages;
-            },
-          },
+            }
+          }
         });
       }
     },

--
Gitblit v1.9.1