From 94456145786f41256e3add8bff0c52b68d3fa215 Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期一, 17 六月 2024 16:56:46 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

---
 src/books/artAndDrama/view/components/chapter001.vue |   72 ++++++++++++++++++++---------------
 1 files changed, 41 insertions(+), 31 deletions(-)

diff --git a/src/books/artAndDrama/view/components/chapter001.vue b/src/books/artAndDrama/view/components/chapter001.vue
index 655d04b..54731ea 100644
--- a/src/books/artAndDrama/view/components/chapter001.vue
+++ b/src/books/artAndDrama/view/components/chapter001.vue
@@ -4,7 +4,7 @@
       <div v-if="showPageList.indexOf(4) > -1">
         <h1 id="a004">
           <img class="img-0" alt="" src="../../assets/images/dy1.jpg" />
-          <audio :src="auidoPathOne" class="audio" controls></audio>
+          <audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
         </h1>
         <div class="bodystyle">
           <div class="bk">
@@ -24,14 +24,14 @@
           <div class="page-footer-number-right">1</div>
         </div>
       </div>
-    </div> 
+    </div>
     <div class="page-box" page="5">
       <div v-if="showPageList.indexOf(5) > -1">
-        <h1>
+        <h1 style="margin-bottom: 0%">
           <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
+        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
         <div class="bodystyle">
-          <img src="../../assets/images/page5.png" alt="" />
           <h2 id="b001">绗竴璇俱��榻愬績鍗忓姏</h2>
           <h3 class="lefth3" id="c001">
             <img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" />
@@ -43,11 +43,13 @@
             <span class="hs1">鈼�</span>澶у0鏈楄涓嬮潰鐨勫彞瀛愶紝杩炰竴杩炰笉鍚岄�昏緫閲嶉煶寮鸿皟鐨勬剰鎬濄��
           </p>
           <h1>
-            <audio :src="auidoPathTwo" class="audio" controls></audio>
+            <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
           </h1>
-          <p>灏忔彁绀猴細鍔犵偣鐨勬枃瀛椾负鏈彞璇濅腑鐨勯�昏緫閲嶉煶锛屽湪鏈楄鍙戦煶鏃惰閲嶈銆�</p>
-      <!-- 杩炵嚎棰� -->
+
+          <!-- 杩炵嚎棰� -->
           <matching :rawData="rawData" :item="question" class="macthing" :primaryColor="'transparent'"></matching>
+          <p>灏忔彁绀猴細鍔犵偣鐨勬枃瀛椾负鏈彞璇濅腑鐨勯�昏緫閲嶉煶锛屽湪鏈楄鍙戦煶鏃惰閲嶈銆�</p>
+
         </div>
         <p><br /></p>
         <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -97,11 +99,11 @@
     </div>
     <div class="page-box" page="7">
       <div v-if="showPageList.indexOf(7) > -1">
-        <h1>
+        <h1 style="margin-bottom: 0%">
           <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
+        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
         <div class="bodystyle">
-          <img src="../../assets/images/page5.png" alt="" />
           <h2 id="b002">绗簩璇俱��娲ユ触涔愰亾</h2>
           <h3 class="lefth3" id="c003">
             <img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" />
@@ -109,7 +111,7 @@
           <p>
             <span class="hs1">鈼�</span>璇峰皢浠ヤ笅璇炬枃閫夋澶у0鏈楄鍑烘潵锛屽姞鐐圭殑瀛楄閲嶈銆�
           </p>
-          <h1><audio :src="auidoPathThree" class="audio" controls></audio></h1>
+          <h1><audio :src="auidoPathThree" controls class="audio" @play="audioPlay"></audio></h1>
 
           <div class="bj3">
             <p class="center">
@@ -147,18 +149,20 @@
     <div class="page-box" page="8">
       <div v-if="showPageList.indexOf(8) > -1">
         <h1>
-          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
+          <img src="../../assets/images/page6-header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
         <div class="bodystyle">
-          <img src="../../assets/images/page5.png" alt="" />
           <h2 id="b003">绗笁璇俱��鍐呭績鐨勫0闊�</h2>
-          <h1 class="lefth3 openImgBox" id="c005">
-            <img class="img-gn1" alt="" src="../../assets/images/1-3.gif" style="height: auto; width: 50%" />
-          </h1>
+          <h3 class="lefth3" id="c006">
+            <img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" />
+          </h3>
           <p>
             <span class="hs1">鈼�</span>璇峰皢浠ヤ笅璇炬枃閫夋澶у0鏈楄鍑烘潵锛屽姞鐐圭殑瀛楄閲嶈銆�
           </p>
-          <h1><audio :src="auidoPathTwo" class="audio" controls></audio></h1>
+          <h1 class="lefth3 openImgBox" id="c005">
+            <img class="img-gn1" alt="" src="../../assets/images/1-3.gif" style="height: auto; width: 50%" />
+          </h1>
+          <h1><audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio></h1>
           <div class="bj3">
             <p class="center">
               <span class="hs">鏄�<a id="w1"></a><sup>1</sup>锛堣妭閫夛級</span>
@@ -173,7 +177,7 @@
                 class="un1">杞绘倓鎮�</span>鐨勶紝鑽�<span class="un1">杞坏缁�</span>鐨勩��
             </p>
           </div>
-          <hr />
+          <hr style="margin-left: 0; width: 20%;" />
           <p class="note">
             <a id="m1">1</a>
             鏈辫嚜娓咃細銆婃槬銆嬶紝瑙佹俯鍎掓晱绛夛細銆婁箟鍔℃暀鑲叉暀绉戜功 璇枃
@@ -189,11 +193,11 @@
     </div>
     <div class="page-box" page="9">
       <div v-if="showPageList.indexOf(9) > -1">
-        <h1>
+        <h1 style="margin-bottom: 0%;">
           <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
+        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
         <div class="bodystyle">
-          <img src="../../assets/images/page5.png" alt="" />
           <h3 class="lefth3" id="c006">
             <img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" />
           </h3>
@@ -205,10 +209,10 @@
               class="hs1">鈼�</span>鐢熸椿涓紝鎴戜滑鎬讳細閬囧埌鍚勭鍚勬牱鐨勮鎯戙�傞潰瀵硅鎯戞椂锛屾垜浠殑鍐呭績甯稿父浼氭湁涓や釜涓嶅悓鐨勫0闊冲嚭鐜帮細涓�涓0闊宠姹傛垜浠弗浜庡緥宸憋紝鍙︿竴涓0闊宠姹傛垜浠殢蹇冩墍娆层�傝浣犲垎鏋愪竴涓嬶紝褰撹殏铓侀槦闀块潰瀵规帀钀界殑濂堕叒娓g殑璇辨儜鏃讹紝浠栧唴蹇冪殑涓や釜澹伴煶浼氳浜涗粈涔堝憿锛�
           </p>
           <p>姝d箟闃熼暱锛氣��
-            <input v-model="questionData.warnUp.one" class="input-bottom-border fz-18" @change="setBookQuestion" />鈥�
+            <input v-model="questionData.warnUp.one" class="input-bottom-border input-w-66"  @change="setBookQuestion" />銆傗��
           </p>
-          <p>榛戞殫闃熼暱锛氣�� <input v-model="questionData.warnUp.two" class="input-bottom-border fz-18"
-              @change="setBookQuestion" />鈥�</p>
+          <p>榛戞殫闃熼暱锛氣�� <input v-model="questionData.warnUp.two" class="input-bottom-border input-w-66" @change="setBookQuestion" />銆傗��
+          </p>
         </div>
       </div>
       <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -231,7 +235,7 @@
             <span class="hs1">鈼�</span>璇峰皢浠ヤ笅璇炬枃閫夋澶у0鏈楄鍑烘潵锛屽姞鐐圭殑瀛楄閲嶈銆�
           </p>
           <h1>
-            <audio :src="auidoPathTwo" class="audio" controls></audio>
+            <audio :src="auidoPathTwo" controls class="audio" @play="audioPlay"></audio>
           </h1>
 
           <div class="bj3">
@@ -260,7 +264,7 @@
               v-model="questionData.warnUp.six" class="input-bottom-border fz-18" style=" width: 10%;"
               @change="setBookQuestion" />锛堣韩浣撴劅瑙夛級鍟婏紒
           </p>
-          <hr />
+          <hr style="margin-left: 0; width: 20%;" />
           <p class="note">
             <a id="m1">1</a>
             鏈辫嚜娓咃細銆婃槬銆嬶紝瑙佹俯鍎掓晱绛夛細銆婁箟鍔℃暀鑲叉暀绉戜功 璇枃
@@ -279,8 +283,9 @@
         <h1>
           <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
+        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
         <div class="bodystyle">
-          <img src="../../assets/images/page5.png" alt="" />
+
           <p class="center openImgBox">
             <img class="img-e" alt="" src="../../assets/images/1-5.gif" />
           </p>
@@ -334,6 +339,7 @@
         <h1>
           <img src="../../assets/images/page6-header-green.png" alt="" style="width: 100%; height: auto" />
         </h1>
+        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
         <div class="bodystyle">
           <h3 class="lefth3" id="c010">
             <img class="img-gn1" alt="" src="../../assets/images/tzyys.jpg" />
@@ -347,8 +353,8 @@
               x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
               controlslist="nodownload" class="w100"
               style="margin-top: 40px; border-radius: 10px; border: 2px solid green;"></video>
-            <h2>瑙嗛: 鎴戜滑鏄竴瀹朵汉</h2>
-           </p>
+          <h2>瑙嗛: 鎴戜滑鏄竴瀹朵汉</h2>
+          </p>
         </div>
       </div>
       <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -370,9 +376,9 @@
     showPageList: {
       type: Array,
     },
-    primaryColor:{
-      type:String,
-      default:"red"
+    primaryColor: {
+      type: String,
+      default: "red"
     }
   },
   //鍦ㄨ繖閲屽璋冪敤鐨勬柟娉曡繘琛屾寕杞�
@@ -551,6 +557,9 @@
         JSON.stringify(this.questionData)
       );
     },
+    audioPlay(e) {
+      this.$emit('closeAudio', e.srcElement.currentSrc)
+    }
   },
 };
 </script>
@@ -579,7 +588,8 @@
   height: 100%;
   background-color: red;
 }
-.macthing{
+
+.macthing {
   background-color: rgb(188, 220, 164);
   padding: 5% 5%;
 }

--
Gitblit v1.9.1