From cc7bbbd9b6a859235c9985cc09836effc1157fe8 Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期五, 07 六月 2024 10:51:38 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/books/artAndDance/view/components/chapter003.vue | 184 ++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 184 insertions(+), 0 deletions(-) diff --git a/src/books/artAndDance/view/components/chapter003.vue b/src/books/artAndDance/view/components/chapter003.vue new file mode 100644 index 0000000..5004bac --- /dev/null +++ b/src/books/artAndDance/view/components/chapter003.vue @@ -0,0 +1,184 @@ +<template> + <div class="chapter" num="4"> + <div class="page-box" page="12" style="min-height: auto"> + <div v-if="showPageList.indexOf(12) > -1"> + <img class="img-0" alt="" src="../../assets/images/dy3.jpg" /> + <img src="../../assets/images/07.gif" alt="" style="width: 56%;" class="cover-gif"> + </div> + </div> + <div class="page-box" page="13"> + <div v-if="showPageList.indexOf(13) > -1" class="pg-mh fl fl-cl"> + <img + src="../../assets/images/pageContentHeader.jpg" + alt="" + class="w100 mb-40" + /> + <div class="padding-96"> + <p class="center"> + <img class="img-a" alt="" src="../../assets/images/06.gif" /> + </p> + <h2 class="lefth2" id="b001"> + <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" /> + </h2> + <h3 id="c001" class="fw-400 fz-26 mb-20">鍏冪礌</h3> + <p class="block2 fw-400 fz-26">鍙屾墜鎸変簬韬綋涓ゆ梺锛屾ā浠垮绔ュぉ鐪熷彲鐖辩殑鏍峰瓙</p> + <p class="block1 w70"><span class="ls fz-26">鈥斺�旀梺鎸夋墜</span></p> + <p class="block2 fz-26">鍗曟墜鏃佹寜锛屾寚鍚�1鐐规柟鍚�</p> + <p class="block1 w70"><span class="ls fz-26">鈥斺�旀ā浠块挀楸�</span></p> + <p class="block2 fz-26">鍗曡吙浜ゆ浛鍚歌烦</p> + <p class="block1 w70"><span class="ls fz-26">鈥斺�斿惛璺虫</span></p> + </div> + <ul class="pb-box"> + <li class="ml-40"> + <img src="../../assets/images/icon/tree.jpg" /> + <span class="dl-ib"> 10 </span> + </li> + <li> + <img class="img-0" alt="" src="../../assets/images/ym.jpg" /> + </li> + </ul> + </div> + </div> + <div class="page-box" page="14"> + <div v-if="showPageList.indexOf(14) > -1"> + <div> + <img src="../../assets/images/chapter-three-header.png" class="w100" /> + </div> + <div class="padding-96"> + <h3 id="c002">绌洪棿涓庢柟鍚�</h3> + <p class="block2">楂樸�佷腑绌洪棿</p> + <p class="block2">1銆�2銆�4銆�8鐐规柟鍚�</p> + <h2 class="lefth2" id="b002"> + <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" /> + </h2> + <ul class="fl fl-cl al-cn audio-box"> + <li class="fl al-cn"> + <span class="wh-nr auido-text mr-8">鐢风闊�</span> + <audio :src="auidoPathOne" controls></audio> + </li> + <li class="fl al-cn mt-20"> + <span class="wh-nr auido-text mr-8"> + 濂崇闊� + </span> + <audio :src="auidoPathTwo" controls></audio> + </li> + </ul> + <h3 id="c009">灏忓効鍨傞挀</h3> + <p class="block2 fm-son">銆斿攼銆曡儭浠よ兘</p> + <p class="block2 m16-0">钃ご绋氬瓙瀛﹀瀭绾讹紝</p> + <p class="block2 m16-0">渚у潗鑾撹嫈鑽夋槧韬��</p> + <p class="block2 m16-0">璺汉鍊熼棶閬ユ嫑鎵嬶紝</p> + <p class="block2 m16-0">鎬曞緱楸兼儕涓嶅簲浜恒��</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" + style="margin-top: 40px;" + ></video> + </div> + <ul> + <li class="fl ju-end mr-40"> + <div> + <span class="dl-ib"> 11 </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="15"> + <div v-if="showPageList.indexOf(15) > -1" class="pg-mh"> + <img + src="../../assets/images/pageContentHeader.jpg" + alt="" + class="w100 mb-40" + /> + <div class="padding-96"> + <h2 class="lefth2" id="b003"> + <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" id="b004"> + <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" /> + </h2> + <div class="bj2"> + <p class="block"> + 瑙傚療鐢熸椿涓挀楸艰�呯殑褰㈣薄锛屾牴鎹凡瀛﹁垶韫堝厓绱狅紝鍒涚紪鍑烘柊鐨勫崟涓�鑸炶箞鍔ㄤ綔鎴栬�呴�犲瀷鍚с�� + </p> + </div> + </div> + <ul class="pb-box"> + <li class="ml-40"> + <img src="../../assets/images/icon/tree.jpg" /> + <span class="dl-ib"> 12 </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:"chapterThree", + props:{ + showPageList:{ + type:Array, + } + }, + mounted() { + this.getVidoePath() + }, + data() { + return { + videoPathOne:"", + auidoPathOne:"", + auidoPathTwo:"" + } + }, + methods: { + async getVidoePath() { + this.videoPathOne = await getResourcePath("36a2cffb28e494bea887f9a905b11863"); + this.auidoPathOne = await getResourcePath("85923e871441c541991be07fe4ce8771"); + this.auidoPathTwo = await getResourcePath("c018f7a6434abfac0b0e0da1174d643a"); + }, + }, + } +</script> + +<style lang="less" scoped> +.cover-gif { + position: absolute; + top: 32%; + left: 22%; + +} +</style> \ No newline at end of file -- Gitblit v1.9.1