From 2ca7f1e9d3ff3c54ec5d10688a33c628ec296f8b Mon Sep 17 00:00:00 2001 From: litian <2804272236@qq.com> Date: 星期一, 12 五月 2025 10:22:42 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/books/toddlerSportsSafetyProtection/view/components/chapter001.vue | 247 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 247 insertions(+), 0 deletions(-) diff --git a/src/books/toddlerSportsSafetyProtection/view/components/chapter001.vue b/src/books/toddlerSportsSafetyProtection/view/components/chapter001.vue new file mode 100644 index 0000000..14fb7f7 --- /dev/null +++ b/src/books/toddlerSportsSafetyProtection/view/components/chapter001.vue @@ -0,0 +1,247 @@ +<template> + <div class="chapter" num="10"> + <!-- 1椤� --> + <div class="page-box" page="10"> + <div v-if="showPageList.indexOf(10) > -1"> + <div class="UnitCover"> + <h1 class="seriesTitle">绗竴绔� </h1> + <h1 class="seriesTitle mb-20">濠村辜鍎胯繍鍔ㄥ畨鍏ㄤ笌淇濇姢姒傝堪 </h1> + <p class="rotate-up">^</p> + <p class="rotate-down">v</p> + <p class="rotate-down">v</p> + <p class="rotate-down">v</p> + <p class="rotate-down">v</p> + <p class="rotate-down">v</p> + <p class="rotate-down">v</p> + <p class="rotate-down mb-20">v</p> + <p class="content"> + <img class="g-pic" src="../../assets/images/0013_01.jpg" alt="" /> + </p> + <p class="quotation">1锛庣悊瑙e┐骞煎効杩愬姩瀹夊叏涓庝繚鎶ょ殑鎰忎箟銆�</p> + <p class="quotation">2锛庢帉鎻″┐骞煎効杩愬姩瀹夊叏涓庝繚鎶ょ殑鐩爣涓庡唴瀹广��</p> + <p class="quotation">3锛庣悊瑙e┐骞煎効杩愬姩椋庨櫓鐨勫奖鍝嶅洜绱犮��</p> + <p class="content"> + <img class="g-pic" src="../../assets/images/0013_02.jpg" alt="" /> + </p> + <div class="bodyPic openImgBox"> + <img + src="../../assets/images/0013-03.jpg" + style="width: 100%" + alt="" + active="true" + /> + </div> + <p class="content"> + <img class="g-pic" src="../../assets/images/0013_04.jpg" alt="" /> + </p> + <p class="quotation"> + 姣忓埌鎴峰娲诲姩鏃堕棿锛屾煇骞煎効鍥暀甯堜笉鎰挎剰缁勭粐骞煎効杩涜鎴峰杩愬姩锛岃涓哄辜鍎垮湪杩愬姩鏃讹紝鍒ゆ柇鍗遍櫓鍜岃嚜鎴戜繚鎶よ兘鍔涢兘杈冨急锛屽鏄撳彂鐢熻繍鍔ㄤ激瀹炽�傚洯闀夸互鍙婂闀夸篃闈炲父鍏虫敞骞煎効鐨勫畨鍏紝鎷呭績骞煎効鍦ㄨ繍鍔ㄤ腑濡傛灉鍑虹幇鎰忓浼ゅ涓嶈兘鍙婃椂澶勭悊锛屼細閫犳垚涓嶅繀瑕佺殑楹荤儲銆傚洜姝よ兘涓嶅嚭鍘诲氨涓嶅嚭鍘伙紝鑳藉皯娲诲姩灏卞皯娲诲姩锛屾姳鐫�澶氬姩澶氬嵄闄┿�佸皯鍔ㄥ皯鍗遍櫓銆佷笉鍔ㄤ笉鍗遍櫓鐨勫績鎬併�� + </p> + <p class="content"> + 杩欑鐜拌薄瀛樺湪浜庝笉灏戝辜鏁欐満鏋勩�傛暀甯堜笉鑳芥纭悊瑙e┐骞煎効杩愬姩涓庡┐骞煎効鎴愰暱鐨勫叧绯伙紝涓嶈兘姝g‘鐞嗚В濠村辜鍎胯繍鍔ㄥ畨鍏ㄤ笌淇濇姢鐨勬剰涔変互鍙婂奖鍝嶅洜绱狅紝鏈珷灏嗛噸鐐硅璁鸿繖浜涘唴瀹广�� + </p> + </div> + </div> + </div> + <!-- 2椤� --> + <div class="page-box" page="11"> + <div v-if="showPageList.indexOf(11) > -1"> + <div class="page-father"> + <ul class="header-left"> + <li class="headerText"> + 濠�<br />骞�<br />鍎�<br />杩�<br />鍔�<br />瀹�<br />鍏�<br />涓�<br />淇�<br />鎶� + </li> + <li class="headerNumber">2</li> + <img src="../../assets/images/a1.jpg" alt="" /> + </ul> + <div class="bodystyle"> + + </div> + </div> + </div> + </div> + <!-- 3椤� --> + <div class="page-box" page="12"> + <div v-if="showPageList.indexOf(12) > -1"> + <div class="page-father"> + <div class="bodystyle-left"> + + </div> + <ul class="header-right"> + <li class="header-right-img"> + <img src="../../assets/images/a2.jpg" alt="" /> + </li> + <img class="header-right-imgTop" src="../../assets/images/a3.jpg" alt="" /> + <li class="header-right-Number">3</li> + <li class="header-right-Text"> + 绗�<br />涓�<br />绔� + </li> + <li class="header-right-Text-bottom"> + 濠�<br />骞�<br />鍎�<br />杩�<br />鍔�<br />瀹�<br />鍏�<br />涓�<br />淇�<br />鎶� + </li> + </ul> + </div> + </div> + </div> + </div> +</template> + +<script> +import { getResourcePath } from "@/assets/methods/resources"; +import { + getCollectResource, + setCollectResource, +} from "@/assets/methods/resources"; +import preView from "@/components/pdfview/index.vue"; +export default { + name: "chapterOne", + props: { + showPageList: { + type: Array, + }, + }, + components: { + preView, + }, + data() { + return { + dialogVisible: false, + pdfDialogRef: "", + somePdfTitleValue: "", + p_md5: "", + collectResourceList: [], + chapter001: { + pdfMd5: { + 1: { + md5: "6a7118abdc38a24995f26c164d63648c", + name: "鎷撳睍瀛︿範锛氫粠缃楁仼鑿插皵寰风殑鑹烘湳鏁欒偛鎬濇兂", + }, + 2: { + md5: "cfac1cfc4b845032d35937a0f6f201e1", + name: "鎷撳睍瀛︿範锛氬揩涔愮璋o紝甯姪瀹濆疂杞绘澗瀛﹁璇�", + }, + }, + }, + collectImg: require("../../assets/images/icon/heart.png"), + collectCheck: require("../../assets/images/icon/heart-check.png"), + videoPathOne: "", + audioPathOne: "", + chapterData: { + isCollectVideoOne: false, + }, + videoQuestionData: { + one: "", + }, + }; + }, + async mounted() { + const videoData = localStorage.getItem( + "artInitiationForAges0to3-book-chapter001-video" + ); + if (videoData) { + this.chapterData = JSON.parse(videoData); + } + + const videoQuestionData = localStorage.getItem( + "artInitiationForAges0to3-book-chapter001-videoQuestionData" + ); + if (videoQuestionData) { + this.videoQuestionData = JSON.parse(videoQuestionData); + } + + this.getVidoePath(); + this.collectResourceList = await getCollectResource( + this.config.activeBook.bookId + ); + }, + + methods: { + async getVidoePath() { + this.audioPathOne = await getResourcePath( + "c19b26c585aecc086a286aa0829c9e3b" + ); + this.videoPathOne = await getResourcePath( + "afebf048dd2bf2cb09004976ea818dc4" + ); + }, + toUrl(val) { + if (val) { + this.p_md5 = this.chapter001.pdfMd5[val].md5; + this.somePdfTitleValue = this.chapter001.pdfMd5[val].name; + this.$refs.pdfDialogRef.openDialog(); + } + }, + + handleCollect(e) { + if (e == "video-01") { + this.handleCollectResource( + "afebf048dd2bf2cb09004976ea818dc4", + "afebf048dd2bf2cb09004976ea818dc4", + "", + "瑙嗛", + "bits", + "娲诲姩瑙嗛锛氬疂瀹濆彂鐜扮編" + ); + this.chapterData.isCollectVideoOne = + !this.chapterData.isCollectVideoOne; + } + this.saveVideoStatus(); + }, + + saveVideoStatus() { + localStorage.setItem( + "artInitiationForAges0to3-book-chapter001-video", + JSON.stringify(this.chapterData) + ); + }, + + saveVideoQuestionData() { + localStorage.setItem( + "artInitiationForAges0to3-book-chapter001-videoQuestionData", + JSON.stringify(this.videoQuestionData) + ); + }, + //璧勬簮鏀惰棌浜嬩欢 + // resourcePath 鏂囦欢璺緞锛� + // resourceType 鏂囦欢绫诲瀷 + // source 鏂囦欢鏉ユ簮 + handleCollectResource( + id, + md5, + resourcePath, + resourceType, + source, + resourceName + ) { + let list = this.collectResourceList; + if (list.findIndex((item) => item.id == id) > -1) { + list = list.filter((item) => item.id != id); + } else { + list.push({ + id, + md5, + resourcePath, + resourceType, + source, + resourceName, + }); + } + this.collectResourceList = list; + setCollectResource( + this.config.activeBook.bookId, + this.collectResourceList + ); + }, + }, +}; +</script> +<style lang="less" scoped> +hr { + margin-left: 0; + margin-bottom: 25px; + width: 25%; + border: none; + height: 1px; + background-color: #000; +} +</style> -- Gitblit v1.9.1