src/books/artAndDance/assets/images/01.gif | 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/artAndDance/assets/images/chapter-two-header.png | 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/artAndDance/assets/main.less | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/artAndDance/view/components/chapter001.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/artAndDance/view/components/chapter002.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/artAndDance/view/components/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/books/childHealth/view/content/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/store/index.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/books/artAndDance/assets/images/01.gif
src/books/artAndDance/assets/images/chapter-two-header.png
src/books/artAndDance/assets/main.less
@@ -64,8 +64,8 @@ .img { text-align: center; font-size: 0.8em; color: #5d78bb; font-size:18px; color: #000; margin-left: 0%; margin-right: 0%; text-indent: 0em; @@ -369,6 +369,9 @@ .m0 { margin: 0; } .mt-40 { margin-top: 40px !important; } .mb-20 { margin-bottom: 20px; } src/books/artAndDance/view/components/chapter001.vue
@@ -1,5 +1,5 @@ <template> <div class="chapter" num="1"> <div class="chapter" num="2"> <div class="page-box" page="4"> <div v-if="showPageList.indexOf(4) > -1"> <img class="img-0" alt="" src="../../assets/images/dy1.jpg" /> @@ -88,7 +88,7 @@ </div> </div> <div class="page-box" page="7"> <div v-if="showPageList.indexOf(5) > -1" class="pg-mh"> <div v-if="showPageList.indexOf(7) > -1" class="pg-mh"> <img src="../../assets/images/pageContentHeader.jpg" alt="" @@ -124,7 +124,7 @@ <ul class="pb-box"> <li class="ml-40"> <img src="../../assets/images/icon/tree.jpg" /> <span class="dl-ib"> 2 </span> <span class="dl-ib"> 4 </span> </li> <li> <img class="img-0" alt="" src="../../assets/images/ym.jpg" /> src/books/artAndDance/view/components/chapter002.vue
New file @@ -0,0 +1,170 @@ <template> <div class="chapter" num="3"> <div class="page-box" page="8"> <div v-if="showPageList.indexOf(8) > -1"> <img class="img-0" alt="" src="../../assets/images/dy2.jpg" /> </div> </div> <div class="page-box" page="9"> <div v-if="showPageList.indexOf(9) > -1" class="pg-mh"> <img src="../../assets/images/pageContentHeader.jpg" alt="" class="w100 mb-40" /> <div class="padding-96"> <p class="center"> <img class="img-b" alt="" src="../../assets/images/image10-1.jpg" /> </p> <p class="center"> <img class="img-a" alt="" src="../../assets/images/image10-2.jpg" /> </p> <p class="img">“羊角式”舞姿</p> </div> <ul class="pb-box"> <li class="ml-40"> <img src="../../assets/images/icon/tree.jpg" /> <span class="dl-ib"> 6 </span> </li> <li> <img class="img-0" alt="" src="../../assets/images/ym.jpg" /> </li> </ul> </div> </div> <div class="page-box" page="10"> <div v-if="showPageList.indexOf(10) > -1" class="pg-mh"> <div> <img src="../../assets/images/chapter-two-header.png" class="w100" /> </div> <div class="padding-96"> <h2 class="lefth2" id="b005"> <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" /> </h2> <h3 id="c004">元素</h3> <p class="block2">单指立于头顶模仿羊角</p> <p class="block1"><span class="ls">——羊角式</span></p> <p class="block2">双膝跪于地面</p> <p class="block1"><span class="ls">——双跪坐</span></p> <p class="block2">左右脚交替踏地</p> <p class="block1"><span class="ls">——原地小碎步、移动小碎步</span></p> <p class="block2">腰部拧转</p> <p class="block1"><span class="ls">——旁腰、拧腰</span></p> <h3 id="c005">空间与方向</h3> <p class="block2">高、中、低空间</p> <p class="block2">1-8点方向</p> <h2 class="lefth2" id="b006"> <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" /> </h2> <h3 id="c006">亡羊补牢</h3> <p class="block2">席一元</p> <p class="block2">羊啊羊啊咩咩叫,有只小羊不见了。</p> <p class="block2">墙啊墙啊垒高高,墙上有个大窟窿。</p> </div> <ul> <li class="fl ju-end mr-40"> <div> <span class="dl-ib"> 7 </span> <img src="../../assets/images/icon/tree.jpg" /> </div> </li> <li> <img class="img-0" alt="" src="../../assets/images/ym.jpg" /> </li> </ul> </div> </div> <div class="page-box" page="11"> <div v-if="showPageList.indexOf(10) > -1" class="pg-mh"> <img src="../../assets/images/pageContentHeader.jpg" alt="" class="w100 mb-40" /> <div class="padding-96"> <p class="block2">羊啊羊啊咩咩叫,羊儿全都吓坏了。</p> <p class="block2">窟窿窟窿黑洞洞,快快补上才安心。</p> <p class="center"> <!-- <img class="img-g" alt="" src="../../assets/images/i0012-1.jpg" /> --> </p> <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls class="w100" ></video> <h2 class="lefth2 mt-40" id="b007"> <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" /> </h2> <div class="bj1"> <p class="block"> <img class="inline" alt="" src="../../assets/images/dn.png" />运用所学舞蹈元素,设立两个补窟窿的场景。 </p> <p class="block"> <img class="inline" alt="" src="../../assets/images/dn.png" />学生自愿分组,每组自行设置与该成语寓意相关的主题,在教师的引导下进行创编,并富有情感地展示出来。 </p> </div> <h2 class="lefth2 mt-40" id="b008"> <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" /> </h2> <div class="bj2"> <p class="block"> 根据本单元所学的舞蹈元素以及成语寓意,发挥想象,创编出新的单一舞蹈动作或造型吧。 </p> </div> <!-- <p class="center"><img class="img-0" alt="" src="../../assets/images/ym.jpg" /></p> --> </div> <ul class="pb-box"> <li class="ml-40"> <img src="../../assets/images/icon/tree.jpg" /> <span class="dl-ib"> 8 </span> </li> <li> <img class="img-0" alt="" src="../../assets/images/ym.jpg" /> </li> </ul> </div> </div> </div> </template> <script> import getResourcePath from "@/assets/methods/resources"; export default { name: "chapterTwo", props: { showPageList: { type: Array, }, }, mounted() { this.getVidoePath(); }, data() { return { videoPathOne: "", }; }, methods: { getVidoePath() { this.videoPathOne = getResourcePath("f6aaaed901868114d948031615250bed"); }, }, }; </script> <style lang="scss" scoped></style> src/books/artAndDance/view/components/index.vue
@@ -17,6 +17,11 @@ v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" ></chapterOne> <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList" > </chapterTwo> </div> </div> </template> @@ -24,6 +29,7 @@ <script> import pageHeader from "./header.vue"; import chapterOne from "./chapter001.vue"; import chapterTwo from "./chapter002.vue"; import NoteIcon from "@/assets/images/biji.png"; import _ from "lodash"; import Swiper from "swiper/bundle"; @@ -33,7 +39,7 @@ export default { data() { return { catalogLength: 2, // 总章节数 catalogLength: 3, // 总章节数 showCatalogList: [], // 显示的章节 loadThreshold: 300, // 触发加载阈值 throttleThreshold: 100, // 节流阈值 @@ -586,16 +592,16 @@ init:(value) => { let currentPage = value.activeIndex + 1; // 获取当前页(从1开始计数) let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector('.pageBox'); var paginationInfoEl = dom.querySelector(".pageBox"); if(paginationInfoEl) paginationInfoEl.textContent = currentPage + '/' + totalPages; paginationInfoEl.textContent = currentPage + "/" + totalPages; }, slideChange:(value) => { let currentPage = value.activeIndex + 1; // 获取当前页(从1开始计数) let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector('.pageBox'); var paginationInfoEl = dom.querySelector(".pageBox"); if(paginationInfoEl) paginationInfoEl.textContent = currentPage + '/' + totalPages; paginationInfoEl.textContent = currentPage + "/" + totalPages; }, }, }); @@ -634,6 +640,7 @@ components: { pageHeader, chapterOne, chapterTwo, }, }; </script> src/books/childHealth/view/content/index.vue
@@ -15,6 +15,8 @@ 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" @@ -157,6 +159,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 +202,7 @@ // 跳转检索结果位置 jumpSearchItem: (data) => { this.searchItemLocation(data); }, } }); } @@ -249,6 +259,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) { // 判断向上滚动还是向下滚动 @@ -633,7 +657,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"; @@ -709,7 +735,7 @@ ), prevEl: (this.container ? this.container : document).querySelector( ".swiper-button-prev" ), ) }, // 窗口变化,重新init,针对F11全屏和放大缩小,必须加 observer: true, @@ -718,18 +744,18 @@ init:(value) => { let currentPage = value.activeIndex + 1; // 获取当前页(从1开始计数) let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector('.pageBox'); var paginationInfoEl = dom.querySelector(".pageBox"); if(paginationInfoEl) paginationInfoEl.textContent = currentPage + '/' + totalPages; paginationInfoEl.textContent = currentPage + "/" + totalPages; }, slideChange:(value) => { let currentPage = value.activeIndex + 1; // 获取当前页(从1开始计数) let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector('.pageBox'); var paginationInfoEl = dom.querySelector(".pageBox"); if(paginationInfoEl) paginationInfoEl.textContent = currentPage + '/' + totalPages; }, }, paginationInfoEl.textContent = currentPage + "/" + totalPages; } } }); } }, src/store/index.js
@@ -9,24 +9,21 @@ actions: { }, mutations: { setTestList(state,value) { state.testList = value }, setQiankun(state,value) { state.qiankun = value }, setQuestionData(state,value) { state.questionData = value }, setRootCmsItemId(state,value) { state.rootCmsItemId = value setZoom(state,value) { state.qiankun.scale = value } }, state: { // 状态数据定义 num:1, testList:[], qiankun: {}, qiankun: { scale: 100, }, questionData:{}, rootCmsItemId:'' },