From dee91930a69ba69502d9506cae3d58d72e7a152b Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期五, 07 六月 2024 16:50:59 +0800 Subject: [PATCH] 阅读器取选中页首字改为50 --- src/books/childHealth/view/content/index.vue | 163 ++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 103 insertions(+), 60 deletions(-) diff --git a/src/books/childHealth/view/content/index.vue b/src/books/childHealth/view/content/index.vue index b3eb5ee..1a10321 100644 --- a/src/books/childHealth/view/content/index.vue +++ b/src/books/childHealth/view/content/index.vue @@ -15,55 +15,67 @@ v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList" ></pageHeader> + <!-- <button @click="setZoom1">娴嬭瘯鏀惧ぇ</button> --> + <!-- <button @click="setZoom2">娴嬭瘯缂╁皬</button> --> <chapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterOne> <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterTwo> <chapterThree v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterThree> <chapterFour v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterFour> <chapterFive v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterFive> <chapterSix v-if="showCatalogList.indexOf(7) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterSix> <chapterSeven v-if="showCatalogList.indexOf(8) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterSeven> <chapterEight v-if="showCatalogList.indexOf(9) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterEight> <chapterNine v-if="showCatalogList.indexOf(10) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterNine> <chapterTen v-if="showCatalogList.indexOf(11) > -1" :showPageList="loadPageList" :questionData="questionDataMap" + :isSearch="isSearch" ></chapterTen> <chapterEleven v-if="showCatalogList.indexOf(12) > -1" @@ -120,7 +132,8 @@ loadPageList: [], questionDataMap: {}, renderSignMap: {}, - highlightData: null + highlightData: null, + isSearch:false }; }, computed: { @@ -157,6 +170,14 @@ this.initViewer(); }, 200); } + }, + pageZoom: { + handler(newVal, oldVal) { + const scrollBox = ( + this.container ? this.container : document + ).querySelector(".page-main"); + scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal; + } } }, mounted() { @@ -192,7 +213,7 @@ // 璺宠浆妫�绱㈢粨鏋滀綅缃� jumpSearchItem: (data) => { this.searchItemLocation(data); - }, + } }); } @@ -238,7 +259,7 @@ // .querySelector("#app") // .querySelectorAll(".page-box"); // 妫�绱� - // console.log(this.searchTextByPage("淇濇姢鍐呰剰鍣ㄥ畼"), "searchTextByPage"); + // console.log(this.searchTextByPage("鍎跨"), "searchTextByPage"); // 妫�绱㈣烦杞� // this.searchItemLocation({ // catalog: 2, @@ -249,6 +270,20 @@ // }, 5000); }, methods: { + // setZoom1() { + // let scale = this.$store.state.qiankun.scale + 10; + // const scrollBox = ( + // this.container ? this.container : document + // ).querySelector(".page-main"); + // this.$store.commit("setZoom", scale); + // }, + // setZoom2() { + // let scale = this.$store.state.qiankun.scale - 10; + // const scrollBox = ( + // this.container ? this.container : document + // ).querySelector(".page-main"); + // this.$store.commit("setZoom", scale); + // }, // 婊氬姩鐩戝惉 scrollFun(event) { // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩 @@ -341,6 +376,10 @@ // 娓叉煋鏍囪 renderSign(type, data) { + // 鐖跺眰璁剧疆绂佹娓叉煋鏍囪鏃朵笉鍐嶈繘琛屾覆鏌� + if (this.$store.state.qiankun.disableSign) { + return false; + } const existence = ( this.container ? this.container : document ).querySelector(`[dataid="${data.id}"]`); @@ -350,9 +389,10 @@ this.container ? this.container : document ).querySelector(`[page="${data.page}"]`); // 鍒涘缓 createTreeWalker 杩唬鍣紝鐢ㄤ簬閬嶅巻鏂囨湰鑺傜偣锛屼繚瀛樺埌涓�涓暟缁� - const treeWalker = ( - this.container ? this.container : document - ).createTreeWalker(pageDom, NodeFilter.SHOW_TEXT); + const treeWalker = document.createTreeWalker( + pageDom, + NodeFilter.SHOW_TEXT + ); const allTextNodes = []; let currentNode = treeWalker.nextNode(); while (currentNode) { @@ -551,7 +591,7 @@ const catalog = catalogDom.getAttribute("num"); let text = null; if (target.querySelector("p")) { - text = target.querySelector("p").textContent.substring(0, 20); + text = target.querySelector("p").textContent.substring(0, 50); } // 杩斿洖椤电爜鍜岀珷鑺備俊鎭� if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange) @@ -577,33 +617,32 @@ target, "chapter" ); + // 娣诲姞椤电爜 + this.loadPageList.push(Number(page)); const catalog = catalogDom.getAttribute("num"); if (!this.questionDataMap[page]) { if (testData && testData[catalog]) { if (testData[catalog][page]) { if (Array.isArray(testData[catalog][page])) { - this.questionDataMap[page] = await getQuestionList( - page, - testData[catalog][page], - this.config.activeBook - ); + this.questionDataMap[page] = await getQuestionList( + page, + testData[catalog][page], + this.config.activeBook + ); } else { const obj = {}; for (let key in testData[catalog][page]) { - obj[key] = await getQuestionList( - [], - testData[catalog][page][key], - this.config.activeBook - ); + obj[key] = await getQuestionList( + [], + testData[catalog][page][key], + this.config.activeBook + ); } this.questionDataMap[page] = obj; } - console.log("棰樼洰", this.questionDataMap); } } } - // 娣诲姞椤电爜 - this.loadPageList.push(Number(page)); // 娓叉煋杩欎竴椤电殑鏍囪 for (const key in this.renderSignMap) { if (this.renderSignMap[key][page]) { @@ -617,9 +656,10 @@ // 楂樹寒琛� setTimeout(() => { // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣 - const pageTextList = ( - this.container ? this.container : document - ).createTreeWalker(target, NodeFilter.SHOW_TEXT); + const pageTextList = document.createTreeWalker( + target, + NodeFilter.SHOW_TEXT + ); // 鍖归厤鍏抽敭瀛� const allPageTextNodes = []; let currentNode = pageTextList.nextNode(); @@ -629,7 +669,9 @@ } for (let i = 0; i < allPageTextNodes.length; i++) { const textDom = allPageTextNodes[i]; - let txtIndex = textDom.textContent.indexOf(this.highlightData.txt); + let txtIndex = textDom.textContent.indexOf( + this.highlightData.txt + ); if (txtIndex > -1) { textDom.parentNode.style.transition = "background-color 0.8s"; @@ -693,40 +735,40 @@ for (let i = 0; i < pptDoms.length; i++) { const dom = pptDoms[i]; new Swiper(dom, { - loop: false, // 鏃犵紳 - autoplay: false, - paginationClickable: true, - slidesPerView: 1, // 涓�缁勪笁涓� - spaceBetween: 30, // 闂撮殧 - // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳 - navigation: { - nextEl: (this.container ? this.container : document).querySelector( - ".swiper-button-next" - ), - prevEl: (this.container ? this.container : document).querySelector( - ".swiper-button-prev" - ), - }, - // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔� - observer: true, - observeParents: true, - on: { - init:(value) => { - let currentPage = value.activeIndex + 1; // 鑾峰彇褰撳墠椤碉紙浠�1寮�濮嬭鏁帮級 - let totalPages = value.slides.length; // 鑾峰彇鎬婚〉鏁� - var paginationInfoEl = dom.querySelector('.pageBox'); - if(paginationInfoEl) - paginationInfoEl.textContent = currentPage + '/' + totalPages; + loop: false, // 鏃犵紳 + autoplay: false, + paginationClickable: true, + slidesPerView: 1, // 涓�缁勪笁涓� + spaceBetween: 30, // 闂撮殧 + // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳 + navigation: { + nextEl: (this.container ? this.container : document).querySelector( + ".swiper-button-next" + ), + prevEl: (this.container ? this.container : document).querySelector( + ".swiper-button-prev" + ) }, - slideChange:(value) => { - let currentPage = value.activeIndex + 1; // 鑾峰彇褰撳墠椤碉紙浠�1寮�濮嬭鏁帮級 - let totalPages = value.slides.length; // 鑾峰彇鎬婚〉鏁� - var paginationInfoEl = dom.querySelector('.pageBox'); - if(paginationInfoEl) - paginationInfoEl.textContent = currentPage + '/' + totalPages; - }, - }, - }); + // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔� + observer: true, + observeParents: true, + on: { + init: (value) => { + let currentPage = value.activeIndex + 1; // 鑾峰彇褰撳墠椤碉紙浠�1寮�濮嬭鏁帮級 + let totalPages = value.slides.length; // 鑾峰彇鎬婚〉鏁� + var paginationInfoEl = dom.querySelector(".pageBox"); + if (paginationInfoEl) + paginationInfoEl.textContent = currentPage + "/" + totalPages; + }, + slideChange: (value) => { + let currentPage = value.activeIndex + 1; // 鑾峰彇褰撳墠椤碉紙浠�1寮�濮嬭鏁帮級 + let totalPages = value.slides.length; // 鑾峰彇鎬婚〉鏁� + var paginationInfoEl = dom.querySelector(".pageBox"); + if (paginationInfoEl) + paginationInfoEl.textContent = currentPage + "/" + totalPages; + } + } + }); } }, initViewer() { @@ -820,9 +862,10 @@ .querySelector(`[page="${pageNum}"]`); if (thisPageDom) { // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣 - const pageTextList = ( - this.container ? this.container : document - ).createTreeWalker(thisPageDom, NodeFilter.SHOW_TEXT); + const pageTextList = document.createTreeWalker( + thisPageDom, + NodeFilter.SHOW_TEXT + ); // 鍖归厤鍏抽敭瀛� const allPageTextNodes = []; let currentNode = pageTextList.nextNode(); -- Gitblit v1.9.1