From cb473a93039981b8dee32543f473f2cd408460e7 Mon Sep 17 00:00:00 2001 From: yiming <m13691596795@163.com> Date: 星期五, 30 八月 2024 16:48:53 +0800 Subject: [PATCH] 数学一单元 --- src/books/mathBook/view/components/index.vue | 147 +++++++++++++++++++++++++++++++++---------------- 1 files changed, 99 insertions(+), 48 deletions(-) diff --git a/src/books/mathBook/view/components/index.vue b/src/books/mathBook/view/components/index.vue index 7f749fe..e4c31fa 100644 --- a/src/books/mathBook/view/components/index.vue +++ b/src/books/mathBook/view/components/index.vue @@ -8,9 +8,18 @@ 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" :questionData="questionDataMap"> + <pageHeader v-if="showCatalogList.indexOf(0) > -1" :showPageList="loadPageList"></pageHeader> + <chapterOne v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList" :questionData="questionDataMap"> </chapterOne> + <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList" :questionData="questionDataMap"> + </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> </div> </template> @@ -19,10 +28,10 @@ import axios from "axios"; import pageHeader from "./header.vue"; import chapterOne from "./chapter001.vue"; -// import chapterTwo from "./chapter002.vue"; -// import chapterThree from "./chapter003.vue" -// import chapterFour from './chapter004.vue' -// import chapterFive from './chapter005.vue' +import chapterTwo from "./chapter002.vue"; +import chapterThree from "./chapter003.vue"; +import chapterFour from './chapter004.vue' +import chapterFive from './chapter005.vue' // import chapterSix from './chapter006.vue' import NoteIcon from "@/assets/images/biji.png"; import _ from "lodash"; @@ -35,7 +44,7 @@ name: "pageContent", data() { return { - catalogLength: 2, // 鎬荤珷鑺傛暟 + catalogLength: 6, // 鎬荤珷鑺傛暟 showCatalogList: [], // 鏄剧ず鐨勭珷鑺� loadThreshold: 300, // 瑙﹀彂鍔犺浇闃堝�� throttleThreshold: 100, // 鑺傛祦闃堝�� @@ -97,7 +106,7 @@ }, mounted() { // 榛樿鍔犺浇绔犺妭 - this.showCatalogList = [1]; + this.showCatalogList = [0]; // 婊氬姩鐩戝惉鑺傛祦 this.throttledScrollHandler = _.throttle( this.scrollFun, @@ -153,36 +162,36 @@ }, 500); // 娴嬭瘯椤甸潰璺宠浆 - setTimeout(() => { - this.gotoPage(1, 9); - // setTimeout(() => { - // this.renderSign("Highlight", { - // id: "2ACA9359", - // txt: "棰樹竴瀛︿範涓婚涓� 杩愬姩", - // page: "10", - // type: "Highlight", - // color: "#F5E12A" - // }); - // setTimeout(() => { - // this.delSign({ - // ids: ["2ACA9359"] - // }); - // }, 2000); - // }, 5000); + // setTimeout(() => { + // this.gotoPage(2, 8); + // // 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); + // // 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); // 鑾峰彇棰樼洰id鍒楄〃 this.getQuestionId(); @@ -205,6 +214,9 @@ // }, // 婊氬姩鐩戝惉 scrollFun(event) { + + this.handleVideoPicture() + // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩 if (event.target.scrollTop > this.previousScrollTop) { // 鍚戜笅 @@ -259,6 +271,7 @@ this.catalogLength - 2, this.catalogLength - 1, this.catalogLength, + ]; } else { this.showCatalogList = [catalog - 1, catalog, catalog + 1]; @@ -540,9 +553,13 @@ this.loadPageList.push(Number(page)); const catalog = catalogDom.getAttribute("num"); if (!this.questionDataMap[page]) { + if (this.questionId && this.questionId[catalog]) { + if (this.questionId[catalog][page]) { + this.questionDataMap[page] = await this.getQuestion(catalog, page); + console.log("棰樼洰", this.questionDataMap); } } @@ -691,11 +708,11 @@ const pageData = { pageHeader, chapterOne, - // chapterTwo, - // chapterThree, - // chapterFour, - // chapterFive, - // chapterSix, + chapterTwo, + + chapterThree, + chapterFour, + chapterFive, }; // 閬嶅巻鎵�鏈夌珷鑺傛枃浠� for (const key in pageData) { @@ -803,6 +820,7 @@ .get(this.config.activeBook.resourceUrl + "/question.json") .then((res) => { this.questionId = res.data.data; + }); }, // 鑾峰彇棰樼洰鏀惰棌id鍒楄〃 @@ -827,6 +845,7 @@ }, // 鑾峰彇绔犺妭棰樼洰 async getQuestion(num, page) { + // debugger let cardList = [ { catalogName: "鍗曢�夐", @@ -854,9 +873,17 @@ const res = await axios.get( this.config.activeBook.resourceUrl + "/question-" + num + ".json" ); - if (!res.data.data) return []; + + console.log(1, res); + + + + // debugger + if (!res.data) return []; + // debugger for (let index = 0; index < res.data.data.length; index++) { const item = res.data.data[index]; + // debugger // 鏁板鍏紡鍔犵被鍚嶅幓淇敼鏍峰紡 if (item.type && item.type == 'material') { if (!item.infoList.length) return false @@ -867,6 +894,7 @@ if (item.answer) item.answer = item.answer.replace(/\<math/gi, '<math class="examination-math"') } item.isCollect = this.collectId.indexOf(item.id) > -1 ? true : false + // debugger if (this.questionId[num][page].indexOf(item.id) > -1) { if (item.type && item.type == "material") { cardList.push(item); @@ -885,21 +913,44 @@ } } } + + console.log(cardList.filter((item) => item.infoList.length > 0)); + return cardList.filter((item) => item.infoList.length > 0); } } else { return []; } }, + + // 瑙嗛灏忕獥 + 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, chapterOne, - // chapterTwo, - // chapterThree, - // chapterFour, - // chapterFive, - // chapterSix, + chapterTwo, + chapterThree, + chapterFour, + chapterFive + + }, }; </script> -- Gitblit v1.9.1