From 1e5f5724f9f2c1c34efec7edb3f33bcfb98d66ba Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期二, 23 七月 2024 14:21:30 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/books/sportsAndHealth/view/components/index.vue | 289 +++++++++++++++++++++++++++++++-------------------------- 1 files changed, 157 insertions(+), 132 deletions(-) diff --git a/src/books/sportsAndHealth/view/components/index.vue b/src/books/sportsAndHealth/view/components/index.vue index c8e9ca8..e9e0093 100644 --- a/src/books/sportsAndHealth/view/components/index.vue +++ b/src/books/sportsAndHealth/view/components/index.vue @@ -3,38 +3,36 @@ <div id="searchDomBox" style="display: none"> <div id="searchContent"></div> </div> - <div - class="public-sportsAndHealth" - :style="{ - fontSize: fontSize ? fontSize + 'px' : '16px', - transform: `scale(${pageZoom ? pageZoom : 1})`, - transformOrigin: 'center top', - }" - > - <front001 - v-if="showCatalogList.indexOf(1) > -1" - :showPageList="loadPageList" - /> - <ChapterOne - v-if="showCatalogList.indexOf(2) > -1" - :showPageList="loadPageList" - :questionData="questionDataMap" - /> - <ChapterTwo - v-if="showCatalogList.indexOf(3) > -1" - :showPageList="loadPageList" - :questionData="questionDataMap" - /> - <ChapterThree - v-if="showCatalogList.indexOf(4) > -1" - :showPageList="loadPageList" - :questionData="questionDataMap" - /> - <ChapterFour + <div class="public-sportsAndHealth" :style="{ + fontSize: fontSize ? fontSize + 'px' : '16px', + transform: `scale(${pageZoom ? pageZoom : 1})`, + transformOrigin: 'center top', + }"> + + + + + + <ChapterOne v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></ChapterOne> + <ChapterTwo v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList"></ChapterTwo> + + + + + + + + + <ChapterThree v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList"></ChapterThree> + <assemblyOne v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList"></assemblyOne> + <assemblyTwo v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList" @openPDFChange="swdtChange" /> + + + <!-- <ChapterFour v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList" :questionData="questionDataMap" - /> + /> --> <!-- <ChapterFive v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList" @@ -104,11 +102,19 @@ </template> <script> -import front001 from "./front001"; -import ChapterOne from "./chapter001"; -import ChapterTwo from "./chapter002"; -import ChapterThree from "./testDynaicTable"; -import ChapterFour from "./testPp"; + + +import Vue from "vue"; + +import ChapterOne from "./front001"; +import ChapterTwo from "./chapter001"; +import ChapterThree from "./chapter002"; + + +import assemblyOne from "./testDynaicTable"; +import assemblyTwo from "./testPp"; + +// import ChapterFour from "./testPp"; // import ChapterFive from "./chapter005"; // import chapterSix from "./chapter006"; // import chapterSeven from "./chapter007"; @@ -156,11 +162,6 @@ return this.$store.state.qiankun.scale / 100; }, }, - provide() { - return { - changeQuestionData: this.changeQuestionData, - }; - }, watch: { showCatalogList: { handler(newVal, oldVal) { @@ -181,11 +182,19 @@ }, }, loadPageList: { - handler() { + handler(newVal, oldVal) { setTimeout(() => { this.initSwiper(); this.initViewer(); }, 200); + }, + }, + pageZoom: { + handler(newVal, oldVal) { + const scrollBox = ( + this.container ? this.container : document + ).querySelector(".page-main"); + scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal; }, }, }, @@ -247,31 +256,70 @@ }, 500); // 娴嬭瘯椤甸潰璺宠浆 - // setTimeout(() => { - // this.gotoPage(1, 15); - // setTimeout(() => { - // this.renderSign("Note", { - // id: "2ACA9359", - // txt: "钀ュ吇绱犲拰鐑噺锛屾墠鑳�", - // page: "100", - // type: "Highlight", - // color: "#F5E12A" - // }); - // setTimeout(() => { - // this.delSign({ - // ids: ["2ACA9359"] - // }); - // }, 2000); - // }, 1000); - // }, 1000); + setTimeout(() => { + this.gotoPage(1, 23); + // setTimeout(() => { + // this.renderSign("Highlight", { + // id: "2ACA9359", + // txt: "棰樹竴瀛︿範涓婚涓� 杩愬姩", + // page: "10", + // type: "Highlight", + // color: "#F5E12A" + // }); + // setTimeout(() => { + // this.delSign({ + // ids: ["2ACA9359"] + // }); + // }, 2000); + // }, 5000); + + // const pageDom = (this.container ? this.container : document) + // .querySelector("#app") + // .querySelectorAll(".page-box"); + // 妫�绱� + // console.log(this.searchTextByPage("淇濇姢鍐呰剰鍣ㄥ畼"), "searchTextByPage"); + // 妫�绱㈣烦杞� + // this.searchItemLocation({ + // catalog: 2, + // page: 10, + // txt: " 杩愬姩绯荤粺鏄敱楠ㄣ�侀杩炵粨鍜岄楠艰倢涓夐儴鍒嗙粍鎴愮殑銆傚叏韬殑楠ㄩ�氳繃楠ㄨ繛缁撶粍鎴愪汉浣撻楠硷紙瑙佸浘1-1锛夈�傞楠兼槸浜轰綋鐨勬敮鏋讹紝鍏锋湁淇濇姢鍐呰剰鍣ㄥ畼銆佷緵鑲岃倝闄勭潃鍜屼綔涓鸿倢鑲夎繍鍔ㄧ殑鏉犳潌绛変綔鐢ㄣ�傚湪绁炵粡绯荤粺鐨勬敮閰嶄笅锛岃倢鑲夋敹缂╃壍鍔ㄦ墍闄勭潃鐨勯缁曠潃鍏宠妭杞姩锛屼娇韬綋浜х敓鍚勭鍔ㄤ綔銆傛墍浠ワ紝杩愬姩绯荤粺鍏锋湁杩愬姩銆佹敮鎸佸拰淇濇姢绛夊姛鑳斤紝骞煎勾鏃舵湡鐨勯楠艰繕鍏锋湁閫犺鍔熻兘銆� ", + // txtIndex: 57 + // }); + }, 500); }, methods: { - changeDomViewer() { - setTimeout(() => { - this.initViewer(); - }, 500); + swdtChange(data) { + console.log("瀛愬簲鐢╬df", data); + if (this.$store.state.qiankun && this.$store.state.qiankun.openPDF) { + if (data.type == "pdf") { + this.$store.state.qiankun.openPDF({ + data: data.data, + }); + } else { + this.$store.state.qiankun.chooseWords({ + type: data.type, + data: data.data, + }); + } + } }, - + changeDomViewer() { + this.initViewer(); + }, + // 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) { // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩 @@ -421,7 +469,6 @@ } } }, - // 鍒犻櫎鏍囪娓叉煋 delSign({ ids, type }) { if (ids && ids.length) { @@ -449,7 +496,6 @@ } } }, - initObservation() { const sections = ( this.container ? this.container : document @@ -478,7 +524,6 @@ } }); }, - initThemeColor() { // 鑾峰彇鍚勭闇�瑕佷富棰樿壊鐨勮妭鐐� const colorDom = ( @@ -515,8 +560,8 @@ page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] - ? chapterThemeColor[chapterNum] - : bookThemeColor; + ? chapterThemeColor[chapterNum] + : bookThemeColor; if (themeColor) { domItem.style.color = themeColor; } @@ -533,8 +578,8 @@ page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] - ? chapterThemeColor[chapterNum] - : bookThemeColor; + ? chapterThemeColor[chapterNum] + : bookThemeColor; if (themeColor) { domItem.style.backgroundColor = themeColor; } @@ -551,14 +596,22 @@ page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] - ? chapterThemeColor[chapterNum] - : bookThemeColor; + ? chapterThemeColor[chapterNum] + : bookThemeColor; if (themeColor) { domItem.style.borderColor = themeColor; } }); }, - + getParentWithClass(element, className) { + console.log(element, className, "element, className"); + while (element.parentElement) { + element = element.parentElement; + if (element.classList.contains(className)) { + return element; + } + } + }, pageChangeCallback(entries, observer) { //entries锛氫唬琛ㄨ瀵熷埌鐨勭洰鏍囧厓绱犵殑闆嗗悎銆� observer锛氫唬琛ㄨ瀵熻�呭璞°�� entries.forEach((entry) => { @@ -590,7 +643,6 @@ } }); }, - loadPageCallback(entries, observer) { entries.forEach(async (entry) => { if (entry.isIntersecting) { @@ -608,26 +660,25 @@ 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; } } } } - // 娓叉煋杩欎竴椤电殑鏍囪 for (const key in this.renderSignMap) { if (this.renderSignMap[key][page]) { @@ -641,7 +692,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(); @@ -674,7 +728,6 @@ } }); }, - initSwiper() { const doms = ( this.container ? this.container : document @@ -693,12 +746,8 @@ spaceBetween: 30, // 闂撮殧 // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳 navigation: { - nextEl: (this.container ? this.container : document).querySelector( - ".swiper-button-next" - ), - prevEl: (this.container ? this.container : document).querySelector( - ".swiper-button-prev" - ), + nextEl: dom.querySelector(".swiper-button-next"), + prevEl: dom.querySelector(".swiper-button-prev"), }, // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔� observer: true, @@ -725,12 +774,8 @@ spaceBetween: 30, // 闂撮殧 // 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳 navigation: { - nextEl: (this.container ? this.container : document).querySelector( - ".swiper-button-next" - ), - prevEl: (this.container ? this.container : document).querySelector( - ".swiper-button-prev" - ), + nextEl: dom.querySelector(".swiper-button-next"), + prevEl: dom.querySelector(".swiper-button-prev"), }, // 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔� observer: true, @@ -754,7 +799,6 @@ }); } }, - initViewer() { const doms = ( this.container ? this.container : document @@ -771,41 +815,19 @@ }); } }, - - swdtChange(data) { - if (this.$store.state.qiankun && this.$store.state.qiankun.chooseWords) { - this.$store.state.qiankun.chooseWords({ - type: data.type, - data: data.data, - }); - } - }, - // 鏍规嵁鍏抽敭瀛楀叏鏂囨绱� searchTextByPage(keyword) { const searchResult = []; let catalogIndex = 0; // 鎵�鏈夌珷鑺傜粍浠讹紙姣忔湰涔﹀埗浣滄椂鍗曠嫭閰嶇疆锛� const pageData = { - front001, + + ChapterOne, ChapterTwo, ChapterThree, - ChapterFour, - // ChapterFive, - // chapterSix, - // chapterSeven, - // chapterEight, - // chapterNine, - // chapter010, - // chapter011, - // chapter012, - // chapter013, - // chapter014, - // chapter015, - // chapter016, - // chapter017, - // chapter018, + assemblyOne, + assemblyTwo }; // 閬嶅巻鎵�鏈夌珷鑺傛枃浠� for (const key in pageData) { @@ -817,7 +839,7 @@ propsData: { showPageList: [], questionData: {}, - isSearch: true + isSearch: true, }, }); pageExample.$mount( @@ -849,7 +871,7 @@ propsData: { showPageList: [pageNum], questionData: {}, - isSearch: true + isSearch: true, }, }); pageExample.$mount( @@ -897,24 +919,27 @@ } } // 杈撳嚭鎼滅储缁撴灉 - // console.log(searchResult); + console.log(searchResult); return searchResult; }, - // 鏍规嵁妫�绱㈢粨鏋滆烦杞搴斾綅缃苟楂樹寒 searchItemLocation(data) { // 璁板綍楂樹寒淇℃伅 this.highlightData = data; // 璺宠浆 - this.gotoPage(data.catalog, data.page, () => {}); + this.gotoPage(data.catalog, data.page, () => { }); }, }, components: { - front001, + + + ChapterOne, ChapterTwo, ChapterThree, - ChapterFour, + assemblyOne, + assemblyTwo + // ChapterFour, // ChapterFive, // chapterSix, // chapterSeven, -- Gitblit v1.9.1