From 60f90e857f12bb08e6387ecd6e46876e8cd557ae Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期二, 02 七月 2024 09:34:17 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

---
 src/books/artAndDrama/view/components/chapter004.vue |   53 
 src/books/artAndDrama/assets/main.less               |    2 
 src/books/English/view/components/chapter001.vue     | 3008 ++++++++++++++------------------------------------------
 src/books/artAndDrama/view/components/chapter003.vue |   80 +
 src/books/artAndDrama/view/components/index.vue      |    2 
 5 files changed, 870 insertions(+), 2,275 deletions(-)

diff --git a/src/books/English/view/components/chapter001.vue b/src/books/English/view/components/chapter001.vue
index 00eb6ce..132d2eb 100644
--- a/src/books/English/view/components/chapter001.vue
+++ b/src/books/English/view/components/chapter001.vue
@@ -26,10 +26,7 @@
     <div class="page-box" page="8">
       <div v-if="showPageList.indexOf(8) > -1">
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -43,22 +40,13 @@
             </h2>
             <h3 id="c001"><span class="bjh3">Warm-up</span></h3>
             <p>
-              <b
-                >鈪�.Write down the English words for the Chinese cultural symbols
-                in the following pictures.</b
-              >
+              <b>鈪�.Write down the English words for the Chinese cultural symbols
+                in the following pictures.</b>
               <span class="btn-box" @click="showAnswerTwo = !showAnswerTwo">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="20.501"
-                  height="20.501"
-                  viewBox="0 0 20.501 20.501"
-                >
-                  <path
-                    class="a"
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
                     d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
-                    transform="translate(-3327.144 15329)"
-                  />
+                    transform="translate(-3327.144 15329)" />
                 </svg>
               </span>
             </p>
@@ -70,120 +58,57 @@
                       <img src="../../assets/images/0012-1.jpg" class="w100" />
                     </p>
                     <p class="center">
-                      1.<input
-                        v-model="questionData.warnUp.one.value"
-                        class="input-bottom-border fz-18"
-                        @blur="handleQuestion('one')"
-                        @change="setBookQuestion"
-                      />
+                      1.<input v-model="questionData.warnUp.one.value" class="input-bottom-border fz-18"
+                        @blur="handleQuestion('one')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.one.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.one.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.one.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.one.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛欳hinese knot
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0012-2.jpg"
-                        style="width: 94%"
-                      />
+                      <img src="../../assets/images/0012-2.jpg" style="width: 94%" />
                     </p>
                     <p class="center">
-                      2.<input
-                        class="input-bottom-border fz-18"
-                        v-model="questionData.warnUp.two.value"
-                        @blur="handleQuestion('two')"
-                        @change="setBookQuestion"
-                      />
+                      2.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.two.value"
+                        @blur="handleQuestion('two')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.two.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.two.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.two.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.two.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛欳hinese medicine
                   </p>
                 </div>
@@ -196,120 +121,57 @@
                       <img src="../../assets/images/0012-3.jpg" class="w100" />
                     </p>
                     <p class="center">
-                      3.<input
-                        class="input-bottom-border fz-18"
-                        v-model="questionData.warnUp.three.value"
-                        @blur="handleQuestion('three')"
-                        @change="setBookQuestion"
-                      />
+                      3.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.three.value"
+                        @blur="handleQuestion('three')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.three.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.three.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.three.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.three.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛欳hinese calligraphy
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0012-4.jpg"
-                        style="width: 93%"
-                      />
+                      <img src="../../assets/images/0012-4.jpg" style="width: 93%" />
                     </p>
                     <p class="center">
-                      4.<input
-                        class="input-bottom-border fz-18"
-                        v-model="questionData.warnUp.four.value"
-                        @blur="handleQuestion('four')"
-                        @change="setBookQuestion"
-                      />
+                      4.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.four.value"
+                        @blur="handleQuestion('four')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.four.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.four.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.four.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.four.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛歍aichi
                   </p>
                 </div>
@@ -322,120 +184,57 @@
                       <img src="../../assets/images/0012-5.jpg" class="w100" />
                     </p>
                     <p class="center">
-                      5.<input
-                        class="input-bottom-border fz-18"
-                        v-model="questionData.warnUp.five.value"
-                        @blur="handleQuestion('five')"
-                        @change="setBookQuestion"
-                      />
+                      5.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.five.value"
+                        @blur="handleQuestion('five')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.five.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.five.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.five.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.five.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛歴weet dumpling
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0012-6.jpg"
-                        style="width: 92%"
-                      />
+                      <img src="../../assets/images/0012-6.jpg" style="width: 92%" />
                     </p>
                     <p class="center">
-                      6.<input
-                        class="input-bottom-border fz-18"
-                        v-model="questionData.warnUp.six.value"
-                        @blur="handleQuestion('six')"
-                        @change="setBookQuestion"
-                      />
+                      6.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.six.value"
+                        @blur="handleQuestion('six')" @change="setBookQuestion" />
                       <span class="icon-box">
-                        <svg
-                          v-if="questionData.warnUp.six.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.six.isRight" t="1716986419862" class="icon"
+                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="questionData.warnUp.six.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="questionData.warnUp.six.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerTwo"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                     绛旀锛欳hinese chess
                   </p>
                 </div>
@@ -450,32 +249,17 @@
                 鏄剧ず绛旀
               </button> -->
               <span class="btn-box" @click="showAnswerOne = !showAnswerOne">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="20.501"
-                  height="20.501"
-                  viewBox="0 0 20.501 20.501"
-                >
-                  <path
-                    class="a"
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
                     d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
-                    transform="translate(-3327.144 15329)"
-                  />
+                    transform="translate(-3327.144 15329)" />
                 </svg>
               </span>
             </p>
             <p class="t0">
-              <input
-                v-model="questionData.warnUp.seven"
-                class="input-bottom-border fz-18"
-                style="width: 100%"
-              />
+              <input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18" style="width: 100%" />
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="width: 100%"
-              v-if="showAnswerOne"
-            >
+            <p class="event-header-text-bc pd-5" style="width: 100%" v-if="showAnswerOne">
               绛旀锛�1. Hanfu 2. Qipao 3. Tang Suit 4. Chinese tea 5. Chinese
               silk 6. Chinese calligraphy & painting 7. Chinese embroidery 8.
               Chinese papercut 9. Chinese lantern 10. Moon cake 11. Memorial
@@ -496,9 +280,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         a
@@ -507,19 +289,12 @@
             <h3 id="c002" class="fl al-cn">
               <span class="bjh3">Listening</span>
               <!--controlslist="noplaybackrate nodownload"鍚庨潰鐨勯煶棰戞鍔犲叆杩欎釜-->
-              <audio
-                :src="resource.listenOne"
-                controls
-                controlslist="noplaybackrate nodownload"
-                class="audio"
-              ></audio>
+              <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
             </h3>
             <p>
-              <b
-                >Four foreigners are talking about their impressions on Chinese
+              <b>Four foreigners are talking about their impressions on Chinese
                 culture.Listen to the recording and match the items with the
-                corresponding descriptions.</b
-              >
+                corresponding descriptions.</b>
             </p>
             <!-- <p class="center">
               <img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
@@ -544,33 +319,16 @@
                 鏄剧ず绛旀
               </button> -->
               <span class="btn-box" @click="showAnswerThree = !showAnswerThree">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="20.501"
-                  height="20.501"
-                  viewBox="0 0 20.501 20.501"
-                >
-                  <path
-                    class="a"
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
                     d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
-                    transform="translate(-3327.144 15329)"
-                  />
+                    transform="translate(-3327.144 15329)" />
                 </svg>
               </span>
             </p>
-            <textarea
-              v-model="questionData.reading.one"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="6"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 fm-son"
-              @change="setBookQuestion"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 91%"
-              v-if="showAnswerThree"
-            >
+            <textarea v-model="questionData.reading.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerThree">
               绛旀锛歍he Silk Road &nbsp;&nbsp;&nbsp; Immigrants Sinologist
             </p>
             <p>
@@ -583,33 +341,18 @@
                 鏄剧ず绛旀
               </button> -->
               <span class="btn-box" @click="showAnswerFour = !showAnswerFour">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="20.501"
-                  height="20.501"
-                  viewBox="0 0 20.501 20.501"
-                >
-                  <path
-                    class="a"
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
                     d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
-                    transform="translate(-3327.144 15329)"
-                  />
+                    transform="translate(-3327.144 15329)" />
                 </svg>
               </span>
             </p>
-            <textarea
-              v-model="questionData.reading.two"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="6"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 fm-son"
-              @change="setBookQuestion"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 91%"
-              v-if="showAnswerFour"
-            >
+            <!-- 鏂囨湰妗� -->
+            <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+            <!-- 绛旀妗� -->
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour">
               绛旀锛�(1)Various delicious food (2)Unique architectures
               (3)Beautiful (4)Intangible cultural heritage, such as Taichi,
               shadow puppet show, traditional Chinese medicine, Peking Opera
@@ -617,12 +360,7 @@
             </p>
             <p class="center"><b>My Experience in Wonderland</b></p>
             <p class="center">
-              <audio
-                :src="resource.readingOne"
-                controls
-                controlslist="noplaybackrate nodownload"
-                class="audio"
-              ></audio>
+              <audio :src="resource.readingOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
             </p>
             <p class="block">
               鈥淪o how was your journey to China?鈥� asks Alexandra.鈥淗ighly
@@ -633,41 +371,29 @@
             </p>
             <p>
               My
-              <span class="word-bc" @click="saveWord($event, 'incredible')"
-                >incredible</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'incredible')">incredible</span>
               journey to China started in 2017 when I got selected as a foreign
               student for PhD studies at one university.When I arrived in
               China,I was like Alice in Alice in Wonderland.I was curious about
               the people,the culture,the
-              <span class="word-bc" @click="saveWord($event, 'cuisine')"
-                >cuisine</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'cuisine')">cuisine</span>
               and of course the huge variety of
-              <span class="word-bc" @click="saveWord($event, 'landscapes')"
-                >landscapes</span
-              >.
+              <span class="word-bc" @click="saveWord($event, 'landscapes')">landscapes</span>.
             </p>
             <p>
               I found many great people and made several Chinese friends along
               the way.These friends made me see China through the eyes of the
               locals.I always found Chinese people very friendly and
-              <span class="word-bc" @click="saveWord($event, 'hospitable')"
-                >hospitable</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'hospitable')">hospitable</span>
               towards foreigners.These Chinese friends made my understanding of
               Chinese culture and
-              <span class="word-bc" @click="saveWord($event, 'civilization')"
-                >civilization</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'civilization')">civilization</span>
               much easier,enjoyable and memorable.I consider China my second
               home and love it like my own country!
             </p>
             <p>
               You cannot
-              <span class="word-bc" @click="saveWord($event, 'explore')"
-                >explore</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'explore')">explore</span>
               China properly if you do not try its delicious variety of food.If
               you ate
             </p>
@@ -682,10 +408,7 @@
     <div class="page-box" page="10">
       <div v-if="showPageList.indexOf(10) > -1">
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -699,16 +422,10 @@
               Chinese food would still never end! Though I love to eat almost
               all kinds of Chinese cuisine,I found Sichuan and Hunan cuisine
               quite
-              <span class="word-bc" @click="saveWord($event, 'mouth-watering')"
-                >mouth-watering</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'mouth-watering')">mouth-watering</span>
               and
-              <span class="word-bc" @click="saveWord($event, 'stimulating')"
-                >stimulating</span
-              >.For a
-              <span class="word-bc" @click="saveWord($event, 'foodie')"
-                >foodie</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'stimulating')">stimulating</span>.For a
+              <span class="word-bc" @click="saveWord($event, 'foodie')">foodie</span>
               like me,China is a heaven.I simply cannot live without Chinese
               food.
             </p>
@@ -718,15 +435,8 @@
               its own story and history.From the big and advanced cities like
               Shanghai or Guangzhou to the ancient cities like Xi鈥檃n and
               Hangzhou,each city has its
-              <span class="word-bc" @click="saveWord($event, 'unique')"
-                >unique</span
-              >
-              <span
-                class="word-bc"
-                style="margin-left: 5px"
-                @click="saveWord($event, 'atmosphere')"
-                >atmosphere</span
-              >
+              <span class="word-bc" @click="saveWord($event, 'unique')">unique</span>
+              <span class="word-bc" style="margin-left: 5px" @click="saveWord($event, 'atmosphere')">atmosphere</span>
               that attracts you.I visited more than a dozen cities and came
               across their charming features and unique landscapes such as
               Huangshan,the Great Wall,Canton Tower.
@@ -740,18 +450,11 @@
               <img class="img-g" alt="" src="../../assets/images/0014-1.jpg" />
             </p> -->
             <p class="fl al-cn mt-40">
-              <span class="zt-cs" style="font-size: 20px"
-                >Words &amp; Expressions</span
-              >
+              <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
               <span class="line-border-box"></span>
             </p>
-            <audio
-              :src="resource.readingTwo"
-              controls
-              controlslist="noplaybackrate nodownload"
-              style="margin-left: 10px"
-              class="audio"
-            ></audio>
+            <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload"
+              style="margin-left: 10px" class="audio"></audio>
             <p>wonderland /藞w蕦nd蓹l忙nd/ <i>n.</i> 鏈夎澶氬濡欎簨鐗╃殑鍦版柟</p>
             <div class="bkbj">
               <p><i>land or place full of marvels or wonderful things</i></p>
@@ -765,9 +468,7 @@
             </p>
             <div class="bkbj">
               <p>
-                <i
-                  >the food served in a restaurant (usually an expensive one)</i
-                >
+                <i>the food served in a restaurant (usually an expensive one)</i>
               </p>
             </div>
             <p>landscape /藞l忙ndske瑟p/ <i>n.</i> 锛堥檰涓婏級 椋庢櫙锛屾櫙鑹�</p>
@@ -784,20 +485,16 @@
             </p>
             <div class="bkbj">
               <p>
-                <i
-                  >a society,its culture and its way of life (during a
+                <i>a society,its culture and its way of life (during a
                   particular period of time or in a particular part of the
-                  world)</i
-                >
+                  world)</i>
               </p>
             </div>
             <p>explore /瑟k藞spl蓴藧(r)/ <i>v.</i> 鎺㈢储锛涜�冨療</p>
             <div class="bkbj">
               <p>
-                <i
-                  >to travel into or around an area or a country in order to
-                  learn about it</i
-                >
+                <i>to travel into or around an area or a country in order to
+                  learn about it</i>
               </p>
             </div>
             <p>mouth-watering <i>adj.</i> 浠や汉鍨傛稁鐨勶紱缇庡懗鐨�</p>
@@ -818,9 +515,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <div class="padding-93">
@@ -836,10 +531,8 @@
             <p>foodie /藞fu藧di/<i>n.</i> 鍚冭揣锛涚編椋熷</p>
             <div class="bkbj">
               <p>
-                <i
-                  >a person who is very interested in cooking and eating
-                  different kinds of food</i
-                >
+                <i>a person who is very interested in cooking and eating
+                  different kinds of food</i>
               </p>
             </div>
             <p>unique /ju<i>藞</i>ni藧k/ <i>adj.</i> 鍞竴鐨勶紱鐙竴鏃犱簩鐨�</p>
@@ -849,10 +542,8 @@
             <p>atmosphere /藞忙tm蓹sf瑟蓹(r)/ <i>n.</i> 姘旀皼锛涙皼鍥�</p>
             <div class="bkbj">
               <p>
-                <i
-                  >the feeling or mood that you have in a particular place or
-                  situation</i
-                >
+                <i>the feeling or mood that you have in a particular place or
+                  situation</i>
               </p>
             </div>
             <ul class="w100 fl fw-wr">
@@ -870,9 +561,8 @@
             <div class="bj-note">
               <p class="m0"><b class="fz-18">Notes:</b></p>
               <p class="m0">
-                <i>Alice in Wonderland</i> 锛�<i
-                  >Alice's Adventures in Wonderland</i
-                >鐨勭畝鍐欙紝涓枃璇戜负銆婄埍涓戒笣姊︽父浠欏銆嬶級锛屾槸19涓栫邯鑻卞浗浣滃鍒樻槗鏂峰崱缃楀皵鍒涗綔鐨勮憲鍚嶅効绔ユ枃瀛︿綔鍝侊紝璁茶堪浜嗕竴涓悕鍙埍涓戒笣鐨勮嫳鍥藉皬濂冲涓轰簡杩介�愪竴鍙彛鐫�鎬�琛ㄣ�佷細璇磋瘽鐨勫厰瀛愯�屼笉鎱庢帀鍏ヤ簡鍏斿瓙娲烇紝浠庤�岃繘鍏ヤ簡涓�涓濂囩殑鍥藉害骞剁粡鍘嗕簡涓�绯诲垪濂囧够鍐掗櫓鐨勬晠浜嬨��
+                <i>Alice in Wonderland</i> 锛�<i>Alice's Adventures in
+                  Wonderland</i>鐨勭畝鍐欙紝涓枃璇戜负銆婄埍涓戒笣姊︽父浠欏銆嬶級锛屾槸19涓栫邯鑻卞浗浣滃鍒樻槗鏂峰崱缃楀皵鍒涗綔鐨勮憲鍚嶅効绔ユ枃瀛︿綔鍝侊紝璁茶堪浜嗕竴涓悕鍙埍涓戒笣鐨勮嫳鍥藉皬濂冲涓轰簡杩介�愪竴鍙彛鐫�鎬�琛ㄣ�佷細璇磋瘽鐨勫厰瀛愯�屼笉鎱庢帀鍏ヤ簡鍏斿瓙娲烇紝浠庤�岃繘鍏ヤ簡涓�涓濂囩殑鍥藉害骞剁粡鍘嗕簡涓�绯诲垪濂囧够鍐掗櫓鐨勬晠浜嬨��
               </p>
             </div>
             <p><b>鈪�.Reading comprehension.</b></p>
@@ -881,458 +571,251 @@
               China.
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball1"
-                :disabled="testData.isComplete"
-                value="Language"
-                id="1"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball1" :disabled="testData.isComplete" value="Language" id="1"
+                v-model="testData.check.value" @change="setTestData" />
               Language
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Language'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Language'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Language'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Language'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball2"
-                :disabled="testData.isComplete"
-                value="People"
-                id="2"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball2" :disabled="testData.isComplete" value="People" id="2"
+                v-model="testData.check.value" @change="setTestData" />
               People
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'People'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'People'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'People'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'People'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball3"
-                :disabled="testData.isComplete"
-                value="Culture"
-                id="3"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball3" :disabled="testData.isComplete" value="Culture" id="3"
+                v-model="testData.check.value" @change="setTestData" />
               Culture
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Culture'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Culture'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Culture'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Culture'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball4"
-                :disabled="testData.isComplete"
-                value="Cuisine"
-                id="4"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball4" :disabled="testData.isComplete" value="Cuisine" id="4"
+                v-model="testData.check.value" @change="setTestData" />
               Cuisine
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Cuisine'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Cuisine'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Cuisine'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Cuisine'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball5"
-                :disabled="testData.isComplete"
-                value="Folk art"
-                id="5"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball5" :disabled="testData.isComplete" value="Folk art" id="5"
+                v-model="testData.check.value" @change="setTestData" />
               Folk art
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Folk art'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Folk art'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Folk art'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Folk art'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball6"
-                :disabled="testData.isComplete"
-                value="Landscapes"
-                id="6"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball6" :disabled="testData.isComplete" value="Landscapes" id="6"
+                v-model="testData.check.value" @change="setTestData" />
               Landscapes
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Landscapes'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Landscapes'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Landscapes'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Landscapes'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              <input
-                type="checkbox"
-                name="ball7"
-                :disabled="testData.isComplete"
-                value="Transportation"
-                id="7"
-                v-model="testData.check.value"
-                @change="setTestData"
-              />
+              <input type="checkbox" name="ball7" :disabled="testData.isComplete" value="Transportation" id="7"
+                v-model="testData.check.value" @change="setTestData" />
               Transportation
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Transportation'
-                    )
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Transportation'
+                  )
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isShowRight(
-                      testData.check.answer,
-                      testData.check.value,
-                      'Transportation'
-                    ) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isShowRight(
+                    testData.check.answer,
+                    testData.check.value,
+                    'Transportation'
+                  ) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 35px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 35px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欳ulture,Cuisine,Landscapes
             </p>
           </div>
@@ -1346,10 +829,7 @@
     <div class="page-box" page="12">
       <div v-if="showPageList.indexOf(12) > -1">
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -1362,92 +842,37 @@
               B.Write down the answer to each question according to the passage.
             </p>
             <p>1.What鈥檙e the author鈥檚 comments about Chinese food?</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.tx.one"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.tx.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欳hinese food is very delicious. Sichuan and Hunan cuisines
               are quite mouth-watering and stimulating.
             </p>
             <p>2.When and why did the author start her journey to China?</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.tx.two"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.tx.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歐hen the author got selected as a foreign student for PhD
               studies at one university in 2017, she started her journey to
               China.
             </p>
             <p>3.What are the author鈥檚 expectations of her stay in China?</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.tx.three"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.tx.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歍he author looks forward to exploring more during her stay.
             </p>
             <p>4.What did the author think of Chinese people?</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.tx.four"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.tx.four" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歍he author thought the local Chinese were very friendly and
               hospitable.
             </p>
             <p>5.What鈥檚 the author鈥檚 impression of the cities in China?</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.tx.five"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.tx.five" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欵ach city has its unique atmosphere with charming features
               and unique landscapes.
             </p>
@@ -1461,277 +886,133 @@
             <p>
               In 2017,the author arrived in China.When she arrived,she was like
               Alice in <i>Alice in Wonderland</i>.She was curious about the
-              people,the culture,the c<input
-                :disabled="testData.isComplete"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                v-model="testData.in.one"
-                @change="setTestData"
-              />
+              people,the culture,the c<input :disabled="testData.isComplete" type="text" class="input-bottom-border"
+                style="width: 60px" v-model="testData.in.one" @change="setTestData" />
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.one)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.one)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.one) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.one) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
               ,and of course the huge variety of l
-              <input
-                :disabled="testData.isComplete"
-                v-model="testData.in.two"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />
+              <input :disabled="testData.isComplete" v-model="testData.in.two" type="text" class="input-bottom-border"
+                style="width: 60px" @change="setTestData" />
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.two)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.two)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.two) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.two) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
               .Chinese friends helped her a lot in understanding Chinese culture
-              and c<input
-                :disabled="testData.isComplete"
-                v-model="testData.in.three"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />
+              and c<input :disabled="testData.isComplete" v-model="testData.in.three" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.three)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.three)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.three) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.three) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
-              .The author believes that one cannot e<input
-                :disabled="testData.isComplete"
-                type="text"
-                v-model="testData.in.four"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />
+              .The author believes that one cannot e<input :disabled="testData.isComplete" type="text"
+                v-model="testData.in.four" class="input-bottom-border" style="width: 60px" @change="setTestData" />
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.four)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.four)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.four) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.four) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
               China properly if he/she does not try its delicious variety of
               food.China has thousands of years of rich and beautiful
-              culture.Each city has its u<input
-                :disabled="testData.isComplete"
-                v-model="testData.in.five"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />
+              culture.Each city has its u<input :disabled="testData.isComplete" v-model="testData.in.five" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.five)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.five)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.in.answer, testData.in.five) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.in.answer, testData.in.five) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
               atmosphere that attracts people.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歝uisine, landscapes, civilization, explore, unique
             </p>
             <p>
@@ -1739,92 +1020,37 @@
               sentences with them.
             </p>
             <p>1.get selected as</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.line.one"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.line.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歋he got selected as the cultural ambassador to show Chinese
               culture on campus.
             </p>
             <p>2.be curious about</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.line.two"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.line.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歁any foreigners are curious about the amazing Chinese
               martial arts.
             </p>
             <p>3.along the way</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.line.three"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.line.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欼 suggest that you go to Tibet by train so that you can
               enjoy the natural scenery along the way.
             </p>
             <p>4.come across</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.line.four"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.line.four" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欻e came across the temple fair in Beijing during the Spring
               Festival.
             </p>
             <p>5.look forward to</p>
-            <textarea
-              :disabled="testData.isComplete"
-              v-model="testData.line.five"
-              placeholder="璇疯緭鍏ュ唴瀹�"
-              rows="4"
-              style="margin-left: 40px; width: 92%"
-              class="fz-16 textarea-text"
-              @change="setTestData"
-            ></textarea>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <textarea :disabled="testData.isComplete" v-model="testData.line.five" placeholder="璇疯緭鍏ュ唴瀹�" rows="4"
+              style="margin-left: 40px; width: 92%" class="fz-16 textarea-text" @change="setTestData"></textarea>
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛歋he is looking forward to visiting the incredible cities in
               China.
             </p>
@@ -1842,9 +1068,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <div class="padding-93">
@@ -1855,19 +1079,10 @@
               people.
             </p>
             <p>
-              <input
-                :disabled="testData.isComplete"
-                v-model="testData.ts.one"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />
+              <input :disabled="testData.isComplete" v-model="testData.ts.one" type="text" class="input-bottom-border"
+                @change="setTestData" />
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛氬瓟瀛愬紑鍒涗簡骞虫皯鍖栫殑鏁欒偛銆�
             </p>
             <p>
@@ -1875,19 +1090,10 @@
               greatly promoted the development of ancient Chinese civilization.
             </p>
             <p>
-              <input
-                :disabled="testData.isComplete"
-                v-model="testData.ts.two"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />
+              <input :disabled="testData.isComplete" v-model="testData.ts.two" type="text" class="input-bottom-border"
+                @change="setTestData" />
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛氬珮绁栧彂鏄庝簡涓浗缂笣鎶�鏈紝杩欐瀬澶у湴淇冭繘浜嗕腑鍥藉彜浠f枃鏄庣殑鍙戝睍銆�
             </p>
             <p>
@@ -1895,19 +1101,10 @@
               tea culture in depth.
             </p>
             <p>
-              <input
-                :disabled="testData.isComplete"
-                v-model="testData.ts.three"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />
+              <input :disabled="testData.isComplete" v-model="testData.ts.three" type="text" class="input-bottom-border"
+                @change="setTestData" />
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛氶檰缇斤紝銆婅尪缁忋�嬬殑浣滆�咃紝瀵逛腑鍥借尪閬撹繘琛屼簡娣卞叆鐨勭爺绌躲��
             </p>
             <p>
@@ -1915,67 +1112,35 @@
               Chinese medical science.
             </p>
             <p>
-              <input
-                :disabled="testData.isComplete"
-                v-model="testData.ts.four"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />
+              <input :disabled="testData.isComplete" v-model="testData.ts.four" type="text" class="input-bottom-border"
+                @change="setTestData" />
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛氬紶浠叉櫙鏄竴浣嶅涓浗鍖诲鏈夌潃閲嶅ぇ褰卞搷鐨勫尰瀛﹀銆�
             </p>
             <p>
               <b>鈪�.Grammar focus:The conditional sentence鈥攊f-clause.</b>
               <span class="btn-box" @click="showAnswer('showImg')">
-                <svg
-                  t="1717037443722"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="30864"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg t="1717037443722" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="30864" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M387.2 471.152l-154.768 258.72v103.488h515.792V626.384l-149.12 103.488z m283.712-51.744a77.632 77.632 0 1 0 77.392 77.616 77.504 77.504 0 0 0-77.472-77.616zM640 0H160.72A96.736 96.736 0 0 0 64 96.72V927.36a96.736 96.736 0 0 0 96.72 96.64h702.56A96.704 96.704 0 0 0 960 927.36V298.016z m7.808 94.736l226.544 211.008h-146.544a80.08 80.08 0 0 1-80-80zM896 927.36a32.688 32.688 0 0 1-32.72 32.64h-702.56A32.704 32.704 0 0 1 128 927.36V96.72A32.752 32.752 0 0 1 160.72 64l423.088 0.384v161.44a144.176 144.176 0 0 0 144 143.92H896z"
-                    p-id="30865"
-                  ></path>
+                    p-id="30865"></path>
                 </svg>
               </span>
             </p>
-            <el-image
-              v-if="showImg"
-              :src="imgThirteen"
-              :preview-src-list="[imgThirteen]"
-            />
+            <el-image v-if="showImg" :src="imgThirteen" :preview-src-list="[imgThirteen]" />
             <p>A.Combine the following sentences into if-clauses.</p>
             <p>
               1.Try using sticks.You can enjoy the fun of having a real Chinese
               meal.
             </p>
             <p>
-              <b>If</b
-              ><input
-                :disabled="testData.isComplete"
-                v-model="testData.gr.one"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />.
+              <b>If</b><input :disabled="testData.isComplete" v-model="testData.gr.one" type="text"
+                class="input-bottom-border" @change="setTestData" />.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欼f you try using sticks, you can enjoy the fun of having a
               real Chinese meal.
             </p>
@@ -1984,39 +1149,19 @@
               there.
             </p>
             <p>
-              <b>If</b
-              ><input
-                :disabled="testData.isComplete"
-                v-model="testData.gr.two"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />.
+              <b>If</b><input :disabled="testData.isComplete" v-model="testData.gr.two" type="text"
+                class="input-bottom-border" @change="setTestData" />.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欼f you go to my Chinese New Year party, you will meet my
               Chinese friends there.
             </p>
             <p>3.Drink some Longjing tea,and you will love it.</p>
             <p>
-              <b>If</b
-              ><input
-                :disabled="testData.isComplete"
-                type="text"
-                v-model="testData.gr.three"
-                class="input-bottom-border"
-                @change="setTestData"
-              />.
+              <b>If</b><input :disabled="testData.isComplete" type="text" v-model="testData.gr.three"
+                class="input-bottom-border" @change="setTestData" />.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欼f you drink some Longjing tea, you will love it.
             </p>
             <p>
@@ -2024,20 +1169,10 @@
               warriors.
             </p>
             <p>
-              <b>If</b
-              ><input
-                :disabled="testData.isComplete"
-                v-model="testData.gr.four"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />.
+              <b>If</b><input :disabled="testData.isComplete" v-model="testData.gr.four" type="text"
+                class="input-bottom-border" @change="setTestData" />.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛欼f I go to Xi鈥檃n one day, I will visit the terracotta
               warriors.
             </p>
@@ -2046,20 +1181,10 @@
               Chicken would possibly be in top three.
             </p>
             <p>
-              <b>If</b
-              ><input
-                :disabled="testData.isComplete"
-                v-model="testData.gr.five"
-                type="text"
-                class="input-bottom-border"
-                @change="setTestData"
-              />.
+              <b>If</b><input :disabled="testData.isComplete" v-model="testData.gr.five" type="text"
+                class="input-bottom-border" @change="setTestData" />.
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛� If you ask foreigners about their favorite Chinese food,
               Kung Pao Chicken would possible be in top three
             </p>
@@ -2068,280 +1193,141 @@
               <i>whether</i>.
             </p>
             <p>
-              1.I was wondering<input
-                :disabled="testData.isComplete"
-                v-model="testData.cm.one"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />to go for a walk in the Summer Palace.
+              1.I was wondering<input :disabled="testData.isComplete" v-model="testData.cm.one" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />to go for a walk in the Summer
+              Palace.
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.one)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.one)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.one) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.one) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              2.We can spend the afternoon on the beach<input
-                :disabled="testData.isComplete"
-                v-model="testData.cm.two"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-              />the weather is fine.
+              2.We can spend the afternoon on the beach<input :disabled="testData.isComplete" v-model="testData.cm.two"
+                type="text" class="input-bottom-border" style="width: 60px" />the weather is fine.
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.two)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.two)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.two) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.two) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              3.I called Wang to find out<input
-                :disabled="testData.isComplete"
-                v-model="testData.cm.three"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />or not he really went to see the Peking opera show.
+              3.I called Wang to find out<input :disabled="testData.isComplete" v-model="testData.cm.three" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />or not he really went to see the
+              Peking opera show.
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.three)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.three)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.three) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.three) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              4.We鈥檙e not interested in<input
-                :disabled="testData.isComplete"
-                v-model="testData.cm.four"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />we get great jobs and that kind of thing.
+              4.We鈥檙e not interested in<input :disabled="testData.isComplete" v-model="testData.cm.four" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />we get great jobs and that kind
+              of thing.
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.four)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.four)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.four) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.four) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
             <p>
-              5.<input
-                :disabled="testData.isComplete"
-                v-model="testData.cm.five"
-                type="text"
-                class="input-bottom-border"
-                style="width: 60px"
-                @change="setTestData"
-              />I go to Sichuan,I will visit Chengdu Research Base of Giant
+              5.<input :disabled="testData.isComplete" v-model="testData.cm.five" type="text"
+                class="input-bottom-border" style="width: 60px" @change="setTestData" />I go to Sichuan,I will visit
+              Chengdu Research Base of Giant
               Panda Breeding.
               <span>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.five)
-                  "
-                  t="1716986419862"
-                  class="icon"
-                  viewBox="0 0 1820 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="18767"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="40"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.five)
+                " t="1716986419862" class="icon" viewBox="0 0 1820 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" width="40"
+                  height="20">
                   <path
                     d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                    fill="#1AFA29"
-                    p-id="18768"
-                  ></path>
+                    fill="#1AFA29" p-id="18768"></path>
                 </svg>
-                <svg
-                  v-if="
-                    testData.isComplete &&
-                    isTextRight(testData.cm.answer, testData.cm.five) == false
-                  "
-                  t="1716987085767"
-                  class="icon"
-                  viewBox="0 0 1024 1024"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="25745"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
-                  width="20"
-                  height="20"
-                >
+                <svg v-if="
+                  testData.isComplete &&
+                  isTextRight(testData.cm.answer, testData.cm.five) == false
+                " t="1716987085767" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
+                  height="20">
                   <path
                     d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                    fill="#d81e06"
-                    p-id="25746"
-                  ></path>
+                    fill="#d81e06" p-id="25746"></path>
                 </svg>
               </span>
             </p>
-            <p
-              class="event-header-text-bc pd-5"
-              style="margin-left: 40px; width: 93%"
-              v-if="showQuestionAnswer"
-            >
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
               绛旀锛� 1.whether &nbsp; 2.if &nbsp; 3.whether &nbsp; 4.whether
               &nbsp; 5.if
             </p>
@@ -2358,10 +1344,7 @@
                   </button>
                 </li>
                 <li>
-                  <button
-                    @click="showQuestionAnswer = !showQuestionAnswer"
-                    class="parimary-btn"
-                  >
+                  <button @click="showQuestionAnswer = !showQuestionAnswer" class="parimary-btn">
                     鏌ョ湅绛旀
                   </button>
                 </li>
@@ -2378,10 +1361,7 @@
     <div class="page-box" page="14">
       <div v-if="showPageList.indexOf(14) > -1">
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -2409,19 +1389,9 @@
               <p>銆�銆�銆�銆�3.What does he/she know about it?</p>
             </div>
             <p class="left">
-              <img
-                class="img-gn"
-                alt=""
-                src="../../assets/images/dy1-worksheet.jpg"
-              />
+              <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
             </p>
-            <table
-              border="1"
-              cellpadding="4"
-              cellspacing="0"
-              style="border-color: #fff"
-              class="fz-14"
-            >
+            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
               <tr class="table-th-bc">
                 <td class="tl-cn">Interviewees</td>
                 <td class="wh-no tl-cn">Chinese Culture</td>
@@ -2440,133 +1410,64 @@
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.one"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.two"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.three"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.four"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.five"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.six"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.seven"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.enight"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.nine"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
             </table>
             <p class="left">
-              <img
-                class="img-gn"
-                alt=""
-                src="../../assets/images/dy1-wordbank.jpg"
-              />
+              <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
             </p>
             <div class="bk-wh">
               <p class="dl-box">
-                <span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'exquisite')"
-                  >exquisite</span
-                >
-                <span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'ancient')"
-                  >ancient</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'incredible')"
-                  >incredible</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'unique')"
-                  >unique</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'traditional')"
-                  >traditional</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'outstanding')"
-                  >outstanding</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'mouth-watering')"
-                  >mouth-watering</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'diverse')"
-                  >diverse</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'hospitable')"
-                  >hospitable</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'enjoyable')"
-                  >enjoyable</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'memorable')"
-                  >memorable</span
-                ><span
-                  class="word-bc mr-20 dl-span"
-                  @click="saveWord($event, 'charming')"
-                  >charming</span
-                >
+                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'exquisite')">exquisite</span>
+                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'ancient')">ancient</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'incredible')">incredible</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'unique')">unique</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'traditional')">traditional</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'outstanding')">outstanding</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'mouth-watering')">mouth-watering</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'diverse')">diverse</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'hospitable')">hospitable</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'enjoyable')">enjoyable</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'memorable')">memorable</span><span
+                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'charming')">charming</span>
               </p>
             </div>
             <div class="resource-primary-border" style="padding: 8px">
@@ -2730,9 +1631,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <div class="padding-93">
@@ -2742,10 +1641,8 @@
             </h2>
             <h3 id="c005"><span class="bjh3">Warm-up</span></h3>
             <p>
-              <b
-                >Put the expressions in the box below on the corresponding
-                answer line under each picture.</b
-              >
+              <b>Put the expressions in the box below on the corresponding
+                answer line under each picture.</b>
             </p>
             <div class="bk-wh">
               <p>
@@ -2758,146 +1655,70 @@
                 <div class="left" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-1.jpg"
-                        alt=""
-                        class="w100"
-                      />
+                      <img src="../../assets/images/0019-1.jpg" alt="" class="w100" />
                     </p>
                     <p class="center">
                       1.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.one.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.one.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.one.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.one.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.one.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.one.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歩ntercity train
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-2.jpg"
-                        alt=""
-                        style="width: 98%"
-                      />
+                      <img src="../../assets/images/0019-2.jpg" alt="" style="width: 98%" />
                     </p>
                     <p class="center">
                       2.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.two.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.two.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.two.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.two.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.two.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.two.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歰nline shopping
                   </p>
                 </div>
@@ -2907,146 +1728,70 @@
                 <div class="left" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-3.jpg"
-                        alt=""
-                        style="width: 98%"
-                      />
+                      <img src="../../assets/images/0019-3.jpg" alt="" style="width: 98%" />
                     </p>
                     <p class="center">
                       3.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.three.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.three.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.three.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.three.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.three.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.three.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歟lectronic payment
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-4.jpg"
-                        alt=""
-                        style="width: 94%"
-                      />
+                      <img src="../../assets/images/0019-4.jpg" alt="" style="width: 94%" />
                     </p>
                     <p class="center">
                       4.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.four.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.four.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.four.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.four.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.four.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.four.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歴hared bike
                   </p>
                 </div>
@@ -3056,146 +1801,70 @@
                 <div class="left" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-5.jpg"
-                        alt=""
-                        class="w100"
-                      />
+                      <img src="../../assets/images/0019-5.jpg" alt="" class="w100" />
                     </p>
                     <p class="center">
                       5.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.five.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.five.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.five.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.five.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.five.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.five.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歵ake-away service
                   </p>
                 </div>
                 <div class="right" style="width: 48%">
                   <div>
                     <p class="center">
-                      <img
-                        src="../../assets/images/0019-6.jpg"
-                        alt=""
-                        style="width: 98%"
-                      />
+                      <img src="../../assets/images/0019-6.jpg" alt="" style="width: 98%" />
                     </p>
                     <p class="center">
                       6.
-                      <select
-                        class="select-border"
-                        v-model="dropdownData.six.value"
-                        @change="setDropdownData"
-                        :disabled="dropdownData.isComplete"
-                      >
-                        <option
-                          v-for="(item, index) in dropDownList"
-                          :key="index"
-                          :value="item"
-                        >
+                      <select class="select-border" v-model="dropdownData.six.value" @change="setDropdownData"
+                        :disabled="dropdownData.isComplete">
+                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                           {{ item }}
                         </option>
                       </select>
                       <span class="icon-box">
-                        <svg
-                          v-if="dropdownData.six.isRight"
-                          t="1716986419862"
-                          class="icon"
-                          viewBox="0 0 1820 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="18767"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="40"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.six.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
+                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                           <path
                             d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
-                            fill="#1AFA29"
-                            p-id="18768"
-                          ></path>
+                            fill="#1AFA29" p-id="18768"></path>
                         </svg>
-                        <svg
-                          v-if="dropdownData.six.isRight == false"
-                          t="1716987085767"
-                          class="icon"
-                          viewBox="0 0 1024 1024"
-                          version="1.1"
-                          xmlns="http://www.w3.org/2000/svg"
-                          p-id="25745"
-                          xmlns:xlink="http://www.w3.org/1999/xlink"
-                          width="20"
-                          height="20"
-                        >
+                        <svg v-if="dropdownData.six.isRight == false" t="1716987085767" class="icon"
+                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
+                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                           <path
                             d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
-                            fill="#d81e06"
-                            p-id="25746"
-                          ></path>
+                            fill="#d81e06" p-id="25746"></path>
                         </svg>
                       </span>
                     </p>
                   </div>
-                  <p
-                    class="event-header-text-bc pd-5"
-                    style="width: 90%"
-                    v-if="showAnswerFive"
-                  >
+                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                     绛旀锛歠acial recognition
                   </p>
                 </div>
@@ -3203,19 +1872,13 @@
             </div>
             <div class="w100 fl ju-cn">
               <div class="fl ju-ev mt-40" style="width: 80%">
-                <button
-                  class="btn-border btn-w"
-                  @click="handleDropdown('judge')"
-                >
+                <button class="btn-border btn-w" @click="handleDropdown('judge')">
                   鎻愪氦
                 </button>
                 <button class="btn-border btn-w" @click="changeDropdown">
                   閲嶅仛
                 </button>
-                <button
-                  @click="showAnswerFive = !showAnswerFive"
-                  class="parimary-btn"
-                >
+                <button @click="showAnswerFive = !showAnswerFive" class="parimary-btn">
                   鏌ョ湅绛旀
                 </button>
               </div>
@@ -3231,10 +1894,7 @@
     <div class="page-box" page="16">
       <div v-if="showPageList.indexOf(16) > -1">
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -3245,15 +1905,50 @@
           <div class="bodystyle">
             <h3 id="c006"><span class="bjh3">Reading</span></h3>
             <p class="center">
-              <img class="img-g" alt="" src="../../assets/images/0020-1.jpg" />
+
             </p>
             <p class="img"></p>
             <p>
               1.We are witnessing the rapid development of modern society.What
               impresses you most?
+              <span class="btn-box" @click="showAnswerFour = !showAnswerFour">
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
+                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                    transform="translate(-3327.144 15329)" />
+                </svg>
+              </span>
             </p>
-            <p>2.What will our life be like in ten or twenty years?</p>
+            <!-- 鏂囨湰妗� -->
+            <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+            <!-- 绛旀妗� -->
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour">
+              绛旀锛�(1)intercitut rain(2)online shopping (3)electronic payment (4)shared bike (5)take-away service (6)facial recognition
+              (7)2022 Beijing Winter Olympics (8)2023 World University Games (9)Hong Kong-Zhuhai-Macao Bridge
+              (10)Scenery spots, such as Jiuzhaigou, the Palace Museum, the Great Wall
+            </p>
+            <p>2.What will our life be like in ten or twenty years?
+              <span class="btn-box" @click="showAnswerFour = !showAnswerFour">
+                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                  <path class="a"
+                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                    transform="translate(-3327.144 15329)" />
+                </svg>
+              </span>
+            </p>
+            <!-- 鏂囨湰妗� -->
+            <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+            <!-- 绛旀妗� -->
+            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour">
+              绛旀锛�(1)population aging (2)worsening climate change
+              (3)more automation and Al,such as flying cars, driverless
+            </p>
             <p class="center"><b>The Great Progress in China</b></p>
+            <p class="center">
+              <audio :src="resource.readingOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
+            </p>
             <p>
               On August 31st,2012,as I landed my feet on Chinese ground,I
               started to breathe in the air coming from the breeze.It was
@@ -3315,27 +2010,18 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <!-- 鍐呭 -->
         <div class="padding-93">
           <div class="bodystyle">
             <p class="fl al-cn mt-40">
-              <span class="zt-cs" style="font-size: 20px"
-                >Words &amp; Expressions</span
-              >
+              <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
               <span class="line-border-box"></span>
             </p>
-            <audio
-              :src="resource.readingTwo"
-              controls
-              controlslist="noplaybackrate nodownload"
-              style="margin-left: 10px"
-              class="audio"
-            ></audio>
+            <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload"
+              style="margin-left: 10px" class="audio"></audio>
             <p>breeze /bri藧z/ <i>n.</i> 寰锛涘拰椋�</p>
             <div class="bkbj">
               <p><i>a light wind</i></p>
@@ -3359,10 +2045,8 @@
             <p>dormitory /藞d蓴藧m蓹tri/ <i>n.</i> 瀛︾敓瀹胯垗锛涢泦浣撳鑸�</p>
             <div class="bkbj">
               <p>
-                <i
-                  >a room for several people to sleep in,esp.in a school or
-                  other institution</i
-                >
+                <i>a room for several people to sleep in,esp.in a school or
+                  other institution</i>
               </p>
             </div>
             <p>neighbour /藞ne瑟b蓹(r)/ <i>n.</i> 閭诲眳锛涢偦浜�</p>
@@ -3380,19 +2064,15 @@
             <p>laptop /藞l忙pt蓲p/ <i>n.</i> 渚挎惡寮忕數鑴戯紱绗旇鏈數鑴�</p>
             <div class="bkbj">
               <p>
-                <i
-                  >a small computer that can work with a battery and be easily
-                  carried</i
-                >
+                <i>a small computer that can work with a battery and be easily
+                  carried</i>
               </p>
             </div>
             <p>stun /st蕦n/ <i>v.</i> 浣块渿鎯婏紙鎴栨儕鎰曘�佺洰鐬彛鍛嗭級</p>
             <div class="bkbj">
               <p>
-                <i
-                  >to surprise or shock sb.so much that he/she cannot think
-                  clearly or speak</i
-                >
+                <i>to surprise or shock sb.so much that he/she cannot think
+                  clearly or speak</i>
               </p>
             </div>
             <p>trigger /藞tr瑟伞蓹(r)/ <i>v.</i> 寮曡捣锛涜Е鍙�</p>
@@ -3406,20 +2086,16 @@
             <p>era /藞瑟蓹r蓹/ <i>n.</i> 鏃朵唬锛涘勾浠�</p>
             <div class="bkbj">
               <p>
-                <i
-                  >a period of time,usually in history,that is different from
+                <i>a period of time,usually in history,that is different from
                   other periods because of particular characteristics or
-                  events</i
-                >
+                  events</i>
               </p>
             </div>
             <p>economy /瑟藞k蓲n蓹mi/ <i>n.</i> 缁忔祹锛涚粡娴庢儏鍐�</p>
             <div class="bkbj">
               <p>
-                <i
-                  >the relationship between production,trade and the supply of
-                  money in a particular country or region</i
-                >
+                <i>the relationship between production,trade and the supply of
+                  money in a particular country or region</i>
               </p>
             </div>
           </div>
@@ -3434,10 +2110,7 @@
       <div v-if="showPageList.indexOf(18) > -1">
         <!-- 澶撮儴 -->
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -3450,10 +2123,8 @@
             <p>boom /bu藧m/ <i>v.</i> 杩呴�熷彂灞曪紱绻佽崳鏄岀洓</p>
             <div class="bkbj">
               <p>
-                <i
-                  >to have a period of rapid growth; to become bigger,more
-                  successful,etc.</i
-                >
+                <i>to have a period of rapid growth; to become bigger,more
+                  successful,etc.</i>
               </p>
             </div>
             <p>potential /p蓹藞ten蕛l/ <i>n.</i> 娼滃姏锛涙綔鑳�</p>
@@ -3559,9 +2230,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <!-- 鍐呭 -->
@@ -3619,19 +2288,9 @@
               changes,then report to the class.
             </p>
             <p class="left">
-              <img
-                class="img-gn"
-                alt=""
-                src="../../assets/images/dy1-worksheet.jpg"
-              />
+              <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
             </p>
-            <table
-              border="1"
-              cellpadding="4"
-              cellspacing="0"
-              style="border-color: #fff"
-              class="fz-14"
-            >
+            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
               <tr class="table-th-bc">
                 <td class="tl-cn">Items</td>
                 <td class="wh-no tl-cn">A Decade Ago</td>
@@ -3661,10 +2320,7 @@
       <div v-if="showPageList.indexOf(20) > -1">
         <!-- 澶撮儴 -->
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -3674,13 +2330,7 @@
         <!-- 鍐呭 -->
         <div class="padding-93">
           <div class="bodystyle">
-            <table
-              border="1"
-              cellpadding="4"
-              cellspacing="0"
-              style="border-color: #fff"
-              class="fz-14"
-            >
+            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
               <tr class="table-th-bc">
                 <td class="tl-cn">Items</td>
                 <td class="wh-no tl-cn">A Decade Ago</td>
@@ -3695,81 +2345,51 @@
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.one"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.two"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.three"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.four"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.five"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.six"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
               <tr class="table-tr-bc">
                 <td>
-                  <textarea
-                    v-model="questionData.table.seven"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.enight"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
                 <td>
-                  <textarea
-                    v-model="questionData.table.nine"
-                    class="w100 table-tr-bc b0 table-textarea"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
               <tr class="table-tr-bc">
                 <td colspan="3">
                   Your suggestion:
-                  <textarea
-                    v-model="questionData.table.seven"
-                    class="w100 table-tr-bc b0 table-textarea textarea-box"
-                    @change="setBookQuestion"
-                  ></textarea>
+                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
+                    @change="setBookQuestion"></textarea>
                 </td>
               </tr>
             </table>
@@ -3778,18 +2398,11 @@
             </h2>
             <h3 id="c008"><span class="bjh3">Listening</span></h3>
             <p>
-              <b
-                >鈪�.Listen to Tom,an overseas student,talking about his journey
-                to China and fill in the blanks with what you hear.</b
-              >
+              <b>鈪�.Listen to Tom,an overseas student,talking about his journey
+                to China and fill in the blanks with what you hear.</b>
             </p>
-            <audio
-              :src="resource.readingTwo"
-              controls
-              controlslist="noplaybackrate nodownload"
-              style="margin-left: 10px"
-              class="audio"
-            ></audio>
+            <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload"
+              style="margin-left: 10px" class="audio"></audio>
             <p>
               After studying in China for almost three years by now,I call China
               my second homeland.I love the natural beauty,the 1.________,the
@@ -3805,11 +2418,9 @@
               of Laoshan鈥� China is such a beautiful country!
             </p>
             <p>
-              <b
-                >鈪�.Listen to the conversation about planning for the upcoming
+              <b>鈪�.Listen to the conversation about planning for the upcoming
                 Chinese Culture Week and circle the right expressions to
-                complete the following sentences.</b
-              >
+                complete the following sentences.</b>
             </p>
             <p>
               1.They would like to organize an activity for foreign students to
@@ -3830,9 +2441,7 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <!-- 鍐呭 -->
@@ -3857,10 +2466,8 @@
               2.What information would you like to tell them about the event?
             </p>
             <p>
-              <b
-                >鈪�.Read the following tips for designing an event poster and
-                mark the key elements in the following poster.</b
-              >
+              <b>鈪�.Read the following tips for designing an event poster and
+                mark the key elements in the following poster.</b>
             </p>
             <p>
               An event poster is a marketing tool designed to attract visitors
@@ -3876,112 +2483,48 @@
             <div class="horizontal" style="display: flex">
               <div class="left" style="width: 48%">
                 <p class="center">
-                  <img
-                    class="img-e"
-                    alt=""
-                    src="../../assets/images/0025-1.jpg"
-                  />
+                  <img class="img-e" alt="" src="../../assets/images/0025-1.jpg" />
                 </p>
               </div>
               <div class="right" style="width: 48%">
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Name of the event
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Date and time
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Location
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Greetings
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Warnings
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Organizer
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Signature
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   A short description of the event
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Contact information
                 </p>
                 <p>
-                  <input
-                    type="checkbox"
-                    name="ball"
-                    value="Language"
-                    id="1"
-                    v-model="testData.check"
-                  />
+                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                   Pictures of the event
                 </p>
               </div>
@@ -3998,10 +2541,7 @@
       <div v-if="showPageList.indexOf(22) > -1">
         <!-- 澶撮儴 -->
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -4012,27 +2552,22 @@
         <div class="padding-93">
           <div class="bodystyle">
             <p>
-              <b
-                >鈪�.DIY Crafts Club is planning a paper-cutting contest to
+              <b>鈪�.DIY Crafts Club is planning a paper-cutting contest to
                 promote Chinese handicrafts.The contest will be held in the
-                lobby of Student Center at</b
-              >6锛�00-8锛�00<b> November</b>16<b
-                >.You're in charge of publicity in the club and are required to
+                lobby of Student Center at</b>6锛�00-8锛�00<b> November</b>16<b>.You're in charge of publicity in the club
+                and are required to
                 design a poster for the contest.Complete the necessary
-                information in the following poster.</b
-              >
+                information in the following poster.</b>
             </p>
             <p class="center">
               <img class="img-a" alt="" src="../../assets/images/0026-1.jpg" />
             </p>
             <p>
-              <b
-                >鈪�.Your class has prepared a Chinese culture exhibition for
+              <b>鈪�.Your class has prepared a Chinese culture exhibition for
                 foreign exchange students.Your group takes the responsibility of
                 designing a poster for it.Discuss with your partner and try to
                 answer the questions below to find out what information is
-                needed.</b
-              >
+                needed.</b>
             </p>
             <div class="dy1-bj4">
               <p class="center"><b>Information to put into our poster</b></p>
@@ -4063,19 +2598,15 @@
           <li class=""></li>
           <li class="fz-18">
             <span class="chapter-left-bc">MODULE 1</span>
-            <span class="chapter-right-bc fw-bl chapter-right-cl"
-              >CHINA,A WONDERLAND</span
-            >
+            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
           </li>
         </ul>
         <!-- 鍐呭 -->
         <div class="padding-93">
           <div class="bodystyle">
             <p>
-              鈪�<b
-                >.Design a poster for the exhibition according to the
-                information in the table above.</b
-              >
+              鈪�<b>.Design a poster for the exhibition according to the
+                information in the table above.</b>
             </p>
             <p class="center">
               <img class="img-b" alt="" src="../../assets/images/0027-1.jpg" />
@@ -4114,10 +2645,7 @@
       <div v-if="showPageList.indexOf(24) > -1">
         <!-- 澶撮儴 -->
         <div class="w100 mb-20" style="padding-right: 20px">
-          <div
-            class="event-header-bc fl al-end"
-            style="height: 100px; padding-left: 40px"
-          >
+          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
             <div class="preface-header-box event-header-text-bc">
               <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
               <span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -4128,11 +2656,7 @@
         <div class="padding-93">
           <div class="bodystyle">
             <p class="left">
-              <img
-                class="img-gn"
-                alt=""
-                src="../../assets/images/dy1-worksheet.jpg"
-              />
+              <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
             </p>
             <p class="center">
               <img class="img-b" alt="" src="../../assets/images/0028-1.jpg" />
@@ -4549,32 +3073,32 @@
       if (type == "one") {
         this.questionData.warnUp.one.value
           ? (this.questionData.warnUp.one.isRight =
-              this.questionData.warnUp.one.value == "Chinese knot")
+            this.questionData.warnUp.one.value == "Chinese knot")
           : (this.questionData.warnUp.one.isRight = null);
       } else if (type == "two") {
         this.questionData.warnUp.two.value
           ? (this.questionData.warnUp.two.isRight =
-              this.questionData.warnUp.two.value == "Chinese medicine")
+            this.questionData.warnUp.two.value == "Chinese medicine")
           : (this.questionData.warnUp.two.isRight = null);
       } else if (type == "three") {
         this.questionData.warnUp.three.value
           ? (this.questionData.warnUp.three.isRight =
-              this.questionData.warnUp.three.value == "Chinese calligraphy")
+            this.questionData.warnUp.three.value == "Chinese calligraphy")
           : (this.questionData.warnUp.three.isRight = null);
       } else if (type == "four") {
         this.questionData.warnUp.four.value
           ? (this.questionData.warnUp.four.isRight =
-              this.questionData.warnUp.four.value == "Taichi")
+            this.questionData.warnUp.four.value == "Taichi")
           : (this.questionData.warnUp.four.isRight = null);
       } else if (type == "five") {
         this.questionData.warnUp.five.value
           ? (this.questionData.warnUp.five.isRight =
-              this.questionData.warnUp.five.value == "sweet dumpling")
+            this.questionData.warnUp.five.value == "sweet dumpling")
           : (this.questionData.warnUp.five.isRight = null);
       } else if (type == "six") {
         this.questionData.warnUp.six.value
           ? (this.questionData.warnUp.six.isRight =
-              this.questionData.warnUp.six.value == "Chinese chess")
+            this.questionData.warnUp.six.value == "Chinese chess")
           : (this.questionData.warnUp.six.isRight = null);
       }
     },
@@ -4591,19 +3115,19 @@
         }
       }
       this.dropdownData = dropdownDatas;
-      this.$set(this.dropdownData,'isComplete',true)
+      this.$set(this.dropdownData, 'isComplete', true)
       this.setDropdownData()
     },
     changeDropdown() {
       localStorage.removeItem("english-dropdown-one");
       for (let key in this.dropdownData) {
         let item = this.dropdownData[key];
-        if(key != 'isComplete') {
+        if (key != 'isComplete') {
           item.value = "";
           item.isRight = null;
-        } 
+        }
       }
-      this.$set(this.dropdownData,'isComplete',false)
+      this.$set(this.dropdownData, 'isComplete', false)
     },
     setDropdownData() {
       localStorage.setItem(
@@ -4727,9 +3251,11 @@
   right: 0;
   background-color: red;
 }
+
 .select-border {
   border: 0;
   border-bottom: 1px solid #767676;
+
   &:focus {
     outline: none;
   }
diff --git a/src/books/artAndDrama/assets/main.less b/src/books/artAndDrama/assets/main.less
index e30c867..29a6e44 100644
--- a/src/books/artAndDrama/assets/main.less
+++ b/src/books/artAndDrama/assets/main.less
@@ -612,7 +612,7 @@
     justify-content: space-between;
   }
   /* 褰撳睆骞曞搴﹁嚦灏戜负600px鏃跺簲鐢ㄦ鏍峰紡 */
-@media screen and (max-width: 420px) {
+@media screen and (max-width: 430px) {
   .ends{
     display: flex;
     align-items: center;
diff --git a/src/books/artAndDrama/view/components/chapter003.vue b/src/books/artAndDrama/view/components/chapter003.vue
index 404ff65..fd54e98 100644
--- a/src/books/artAndDrama/view/components/chapter003.vue
+++ b/src/books/artAndDrama/view/components/chapter003.vue
@@ -5,14 +5,14 @@
                 <h1 id="a004">
                     <!-- 杩欓噷鐨勫姩鍥炬湁闂锛屾病鏈夎儗鏅浘鐗� -->
                     <img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
-                    <audio :src="auidoPathOne" controls class="audio"></audio>
+                    <audio :src="audioPathOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
                 </h1>
                 <div class="bodystyle">
                     <div class="bk">
                         <div class="bj1">
                             <p class="left"><img class="img-gn" alt="" src="../../assets/images/dydd.jpg" /></p>
                         </div>
-                        <p class="block" style="margin:  8% 5% 5% 7%">
+                        <p class="" style="margin:  8% 5% 5% 7%">
                             姣忎釜浜虹殑蹇冧腑閮芥湁涓�涓垶鍙帮紝婕旂粠鐫�鐢熸椿鐨勯吀鐢滆嫤杈o紝璁板綍鐫�鎴愰暱鐨勭偣鐐规淮婊淬�傘�婁竴鍧楀ザ閰�嬩腑鐨勬瘡鍙皬铓傝殎涔熸湁寰堝蹇冮噷璇濊琛ㄨ揪锛岃鎴戜滑涓�璧锋紨缁庡嚭鏉ュ惂锛�</p>
                     </div>
                 </div>
@@ -41,8 +41,8 @@
                     <h3 class="lefth3" id="c022" style="margin-top: 7%"><img class="img-gn1" alt=""
                             src="../../assets/images/czysj.jpg" /></h3>
                     <p class="text"><span class="hs1">鈼�</span>閭�璇峰皬浼欎即鍒嗚鑹叉湕璇甸檮褰曚腑鐨勫墽鏈�夋1锝�2锛岄噸璇诲姞鐐规枃瀛椼��</p>
-                    <p class="block3" style=""><span class="hs">鍓ф湰</span></p>
-                    <p class="center1 text" style="font-size: 25px; margin: 3% 0;"><span class="hs">涓�鍧楀ザ閰�</span></p>
+                    <p class="block3" style="margin: 3% 0%;"><span class="hs">鍓ф湰:銆�涓�鍧楀ザ閰�</span></p>
+                    <!-- <p class="center1 text" style="font-size: 25px; margin: 3% 0;"><span class="hs">涓�鍧楀ザ閰�</span></p> -->
                     <!-- 姝ゅ涓洪檮褰曡祫婧愬 -->
                     <div class="Options text">
                         <span class="folder" v-for="(segment, index) in segments" :key="index"
@@ -73,7 +73,7 @@
                     <p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/3-2.gif" /></p>
                     <p class="text"><span class="hs1">鈼�</span>璇锋妸铓傝殎闃熼暱鐨勫彴璇嶅拰浠栫殑鍐呭績鐙櫧杩炶捣鏉ュ惂锛�</p>
                     <!-- 杩炵嚎棰� -->
-                    <matching :rawData="rawData" :question="question" class="macthing" :primaryColor="'transparent'" :bordercolor="'transparent'" >
+                    <matching :rawData="rawData" :question="question" class="macthing" :primary-color="color" :bordercolor="'#fff'">
                     </matching>
                 </div>
                 <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -166,14 +166,30 @@
                 <div class="bodystyle" style="margin-top: 3%;">
                     <h2 id="b015" class="problem">鍗曞厓娲诲姩浠诲姟</h2>
                     <h3 class="lefth3" id="c029"><img class="img-gn1" alt="" src="../../assets/images/xsyty.jpg" /></h3>
-                    <p class="text"><span class="hs1">鈼�</span>鍠樻皵缁冧範</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>鍠樻皵缁冧範</span>
+                        <span> <audio :src="audioPathTwo" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傛垨鍙夎叞锛屽弻鑴氬垎寮�锛屼笌鑲╁悓瀹姐�傛ā浠垮皬鐙楀枠姘旓紝鎰熷彈鑵归儴鐨勨�滃懠鍚糕�濈姸鎬侊紝鎯宠薄鑷繁鐨勮吂閮ㄦ槸涓�涓皵鐞冿紝鍦ㄥ惛姘旀椂鑵归儴鍚戝鎵╁紶锛屽悙姘旀椂鑵归儴鍚戝唴鏀剁缉銆�
                     </p>
-                    <p class="text"><span class="hs1">鈼�</span>鈥滃樁鈥濆0缁冧範</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>鈥滃樁鈥濆0缁冧範</span>
+                        <span> <audio :src="audioPathThree" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">鍦ㄢ�滃枠姘旂粌涔犫�濈殑鍩虹涓婏紝鍙戝嚭鈥滃樁鈥濋煶锛屾瘡缁�4鐭�1闀裤��</p>
-                    <p class="text"><span class="hs1">鈼�</span>鈥滃槦鈥濋煶缁冧範</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>鈥滃槦鈥濋煶缁冧範</span>
+                        <span> <audio :src="audioPathFour" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鍒嗗紑锛屼笌鑲╁悓瀹姐�傛斁鏉惧弻鍞囷紝娣卞惛姘旓紝鍚瑰嚭姘旀祦甯﹀姩鍢村攪鎶栧姩锛屽彂鍑衡�滃槦鈥濈殑澹伴煶锛屽0闊宠秺闀胯秺濂姐��</p>
-                    <p class="text"><span class="hs1">鈼�</span>鈥滄垜浠禐缇庨暱姹熲�濇皵澹扮粌涔�</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>鈥滄垜浠禐缇庨暱姹熲�濇皵澹扮粌</span>
+                        <span> <audio :src="audioPathFive" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio></span>
+                    </p>
                     <p class="text">骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鍒嗗紑锛屼笌鑲╁悓瀹姐�備互璇存倓鎮勮瘽鐨勬劅瑙夛紝璇村嚭鈥滄垜浠禐缇庨暱姹熲�濓紝骞堕�愭澧炲姞姘斿0鐨勫姏搴︼紝鎵惧埌鍦ㄨ垶鍙颁笂璇存倓鎮勮瘽鐨勬劅瑙夈��</p>
                 </div>
                 <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -197,7 +213,7 @@
                     <p class="center text">
                         <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
                             x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
-                            controlslist="nodownload" class="w100 video" 
+                            controlslist="nodownload" class="w100 video"
                             style="margin-top: 40px; border-radius: 10px; border: 2px solid green;"></video>
                     </p>
                     <p class="center videoname">
@@ -246,15 +262,20 @@
             collectImg: require("../../assets/images/icon/heart.png"),
             collectCheck: require("../../assets/images/icon/heart-check.png"),
             videoPathOne: "",
-            auidoPathOne: "",
+            audioPathOne: "",
+            audioPathTwo: "",
+            audioPathThree: "",
+            audioPathFour: "",
+            audioPathFive: "",
             segments: [1, 2, 3, 4, 5],
+            color:"#fff",
             activeIndex: null, // 鐢ㄤ簬杩借釜褰撳墠娲诲姩鐨勬寜閽储寮�  
             contents: [ // 瀵瑰簲閫夋鐨勫唴瀹癸紝杩欓噷鐢ㄥ瓧绗︿覆浣滀负绀轰緥  
-                ' <p class="block text">銆愯捣鍏夛紝铓傝殎闃熼暱涓婂満銆�</p><p class="block text">鍜诲捇鈥�</p><p class="block text">銆愯殏铓侀槦闀垮惞鍝嶉泦鍚堝彿锛岃殏铓佷滑杩呴�熻窇涓婂満绔欏ソ闃熷舰銆�</p><p class="block text">铓傝殎闃熼暱锛�<span class="un1">鎴戝甯�</span>锛佷粖澶╂惉杩愮伯椋燂紝鍙<span class="un1">鍑哄姏</span>锛屼笉璁�<span class="un1">鍋峰槾</span>銆傝皝鍋峰槾灏�<span class="un1">缃氳皝</span>锛�</p><p class="block text">铓傝殎浠細鏀跺埌锛�</p><p class="block text">灏忚殏铓侊細锛堝榾鍜曪級瑕佹槸鍋峰槾鐨�<span class="un1">鏄偍鍛�</span>锛�</p><p class="block text">铓傝殎闃熼暱锛氾紙涔夋璇嶄弗锛�<span class="un1">鐓ф牱鍙楃綒</span>锛�</p><p class="block text">銆愯殏铓佷滑榧撴帉銆�</p><p class="block text">铓傝殎闃熼暱锛氱◢鎭紒绔嬫锛佸鎵鹃鐗╋紒鍑哄彂锛�</p><p class="block text">銆愯殏铓佷滑浜夊厛鎭愬悗鍥涘瀵婚銆�</p><p class="block text">澶уご铓傝殎锛氾紙绐佺劧锛�<span class="un1">鎶ュ憡</span>锛�</p><p class="block text">铓傝殎闃熼暱锛氭�庝箞浜嗭紵</p><p class="block text">澶уご铓傝殎锛氾紙鎸囩潃锛夎繖閲屾湁涓�鍧楀ぇ濂堕叒锛�</p><p class="block text">銆愪竴鍧楀ザ閰紙婕斿憳锛夎洞鍦ㄨ钀藉銆�</p><p class="block text">铓傝殎闃熼暱锛氾紙鍏村锛夊摝锛�</p><p class="block text">銆愯殏铓侀槦闀胯濂堕叒鐨勯鍛宠糠浣忥紝杞捣浜嗗湀鍦堛��</p><p class="block text">銆愰煶涔愯捣锛岃殏铓侀槦闀垮拰濂堕叒浜鸿烦璧蜂簡鑸炶箞銆�</p><p class="block text">铓傝殎闃熼暱锛氾紙闄堕唹锛夊ザ閰�︹�﹀ザ閰�︹�﹀~楗辫倸瀛愪笉鍐嶅懕鍛卞彨銆傚ザ閰�︹�﹀ザ閰�︹�﹀悆涓嬩竴鍙d竴澹扮編濡欌�︹��</p><p class="block text">銆愯殏铓佷滑鍋滀笅鎵嬮噷鐨勬惉杩愬伐浣滐紝鐪嬬潃闃熼暱銆�</p><p class="block text">澶уご铓傝殎锛氾紙澶у枈锛夐槦闀匡紒</p><p class="block text">銆愯殏铓侀槦闀胯鍚撻啋锛屽ザ閰汉瓒村湪鍦颁笂銆�</p><p class="block text">灏忕溂闀滆殏铓侊細闃熼暱锛侀槦闀匡紒<span class="un1">蹇偣鎼繍鍚�</span>锛佽繖涔�<span class="un1">鐑�</span>鐨勫ぉ锛屽啀涓嶅嚭鍙戯紝濂堕叒灏�<span class="un1">鍖�</span>鍟︼紒</p><p class="block text">铓傝殎闃熼暱锛氳寰楀锛佹垜鐜板湪灏�<span class="un1">鎼�</span>锛�</p><p class="block text">銆愯殏铓侀槦闀胯蛋鍒板ザ閰潰鍓嶄娇鍔叉姮銆�</p><p class="block text">铓傝殎闃熼暱锛氬搸鍝燂紝鍝庡摕锛屽搸鍝熷摕銆�</p><p class="block text">銆愯殏铓侀槦闀夸竴娆′篃娌℃姮璧锋潵銆�</p>',
-                ' <p class="block text">铓傝殎闃熼暱锛氾紙璧疯韩锛�<span class="un1">鎴戝喅瀹氫簡</span>锛佸ぇ瀹�<span class="un1">涓�璧锋惉</span>锛佽繖鍧楀ザ閰互鎴戜负棣栵紝鎼繍鐨勮矾涓�<span class="un1">涓嶈鍋峰悆</span>锛�</p><p class="block text">铓傝殎浠細<span class="un1">鏄�</span>锛�</p><p class="block text">銆愯殏铓佷滑杩呴�熷洿鎴愪竴鍦堬紝铓傝殎闃熼暱绔欏湪濂堕叒鏈�鍓嶉潰銆�</p><p class="block text">铓傝殎闃熼暱锛氬惉鎴戝彛浠わ紒3锛�2锛�1锛佹姮锛�</p>                  <p class="block text">銆愬ザ閰鎶捣銆�</p><p class="block text">澶уご铓傝殎锛氬搰锛佽繖鍧楀ザ閰�<span class="un1">濂介鍣�</span>锛�</p><p class="block text">灏忕溂闀滆殏铓侊細鎴戞兂<span class="un1">鍜�</span>涓�鍙o紒</p><p class="block text">灏忚殏铓侊細濡傛灉鑳�<span class="un1">鑸斾竴涓�</span>灏卞ソ浜嗭紒</p><p class="block text">铓傝殎灏忓锛氭垜鐨勫彛姘存祦鍑烘潵浜嗭紒</p><p class="block text">铓傝殎闃熼暱锛氫笉璁哥瀻鎯筹紒涓嶈鍋峰悆锛�<span class="un1">鍑哄彂</span>锛�</p><p class="block text">銆愰煶涔愯捣锛岃殏铓佷滑鎶潃濂堕叒鍚戝墠璧扮潃銆�</p><p class="block text">铓傝殎浠細濂堕叒锛佸ザ閰紒鎴戜滑鐨勫ザ閰紒濂堕叒锛佸ザ閰紒鎴戜滑涓�璧峰垎浜��</p><p class="block text">銆愯殏铓佷滑闄堕唹涓��</p>',
-                ' <p class="block text">鍢��</p><p class="block text">銆愯殏铓佷滑鐢ㄥ姴杩囩寷锛屽ザ閰殑涓�涓鎺変簡銆�</p><p class="block text">铓傝殎灏忓锛�<span class="un1">鍟�</span>锛侀槦闀匡紒濂堕叒鐨勮<span class="un1">鎺変簡</span>锛�</p> <p class="block text">銆愬ぇ瀹剁湅鍒版帀鍦ㄥ湴涓婄殑濂堕叒銆�</p><p class="block text">铓傝殎浠細鍝囧摝锛�</p><p class="block text">铓傝殎闃熼暱锛氱瓑绛夛紒</p><p class="block text">銆愯垶鍙板彉鍏夛紝婕斿憳鍔ㄤ綔瀹氭牸銆�</p><p class="block text">铓傝殎闃熼暱锛氭帀浜�<span class="un1">涓�涓</span>锛岃繖璇�<span class="un1">鎬庝箞鍔�</span>锛�<span class="un1">涓㈡帀</span>锛屽疄鍦�<span class="un1">澶彲鎯�</span>锛�<span class="un1">瓒佹満鍚冩帀</span>锛屽張瑕佺姱涓嶈鍋峰槾鐨勭浠ゃ�傛�庝箞鍔炲憿锛熸湁涓姙娉曪紒鎴戣鏄�<span class="un1">鍋峰槾</span>璋佷篃<span class="un1">鐪嬩笉瑙�</span>锛�<span class="un1">杩欐牱</span>涓嶅氨琛屽暒锛佸ぇ瀹跺惉濂藉暒锛�</p>',
-                ' <p class="block text">銆愯垶鍙板彉鍏夛紝婕斿憳绔嬫绔欏ソ銆�</p><p class="block text">铓傝殎闃熼暱锛氫紤鎭竴浼氬効锛�</p><p class="block text">铓傝殎灏忓锛�<span class="un1">涓轰粈涔�</span>瑕佷紤鎭憖锛�</p><p class="block text">灏忕溂闀滆殏铓侊細闃熼暱锛佽繖鍧楁帀鍦ㄥ湴涓婄殑濂堕叒<span class="un1">鎬庝箞鍔炲憖</span>锛�</p><p class="block text">澶уご铓傝殎锛氭垜浠涓嶆妸瀹�<span class="un1">鍒嗕簡鍚�</span>锛�</p><p class="block text">铓傝殎闃熼暱锛氬惉鎴戣锛�<span class="un1">浼戞伅</span>锛�<span class="un1">绔嬪埢浼戞伅</span>锛佸ぇ瀹舵惉杩愬お杈涜嫤鍟︼紒鍒嗘暎寮�锛屽摢閲屽噳蹇氨鍒板摢閲屼紤鎭紒</p><p class="block text">銆愬ぇ瀹朵緷鏃т笉鍔ㄣ��</p><p class="block text">铓傝殎闃熼暱锛氬叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝o紒鍚戝悗鈥旇浆锛侀綈姝モ�旇蛋锛�</p><p class="block text">铓傝殎闃熼暱锛氱珛鈥斿畾锛佸師鍦颁紤鎭紒</p><p class="block text">銆愯殏铓佷滑璺熼殢鍙d护娑堝け鍦ㄨ崏涓涢噷銆�</p>', 
-                ' <p class="block text">銆愯殏铓侀槦闀垮悜鑽変笡閲屾湜鍘伙紝纭畾娌℃湁澹板搷銆�</p><p class="block text">铓傝殎闃熼暱锛氾紙灏忓0锛夊樋鍢垮樋锛屽悆鎺夊悗灏辫琚鍒蛋鎴栬�呭氨璇磋鑰侀拱鍚冩帀灏卞ソ鍟︼紒</p><p class="block text">銆愯殏铓侀槦闀夸綆涓嬪ご锛屽梾浜嗕竴涓嬪ザ閰��</p><p class="block text">铓傝殎闃熼暱锛氬懗閬�<span class="un1">鐪�</span>棣欙紒</p><p class="block text">銆愯殏铓侀槦闀跨殑鎵嬩几鍚戝ザ閰福锛岀獊鐒讹紝濂堕叒浜虹珯浜嗚捣鏉ャ��</p><p class="block text">銆愬彉鍏夈��</p><p class="block text">濂堕叒浜猴細涓嶈鍚冿紒</p><p class="block text">铓傝殎闃熼暱锛氾紙鍚撲簡涓�璺筹級浣犱綘浣狅紒浣犳�庝箞<span class="un1">绔�</span>璧锋潵鍟︼紒</p><p class="block text">濂堕叒浜猴細鎴�<span class="un1">瀹炲湪</span>鐪嬩笉涓嬪幓鍟︼紒</p><p class="block text">铓傝殎闃熼暱锛氾紙瀹虫�曪級鏁戝懡鍝囷紒濂堕叒<span class="un1">娲�</span>鍟︼紒</p><p class="block text">銆愯殏铓侀槦闀胯窇銆�</p><p class="block text">濂堕叒浜猴細<span class="un1">绔欎綇</span>锛�</p><p class="block text">铓傝殎闃熼暱锛氫綘瑕佸共浠�涔堬紵</p><p class="block text">濂堕叒浜猴細<span class="un1">杩欏潡</span>锛�<span class="un1">浣犱笉鑳藉悆</span>锛�</p><p class="block text">铓傝殎闃熼暱锛氫负浠�涔堬紵</p><p class="block text">濂堕叒浜猴細<span class="un1">绗竴</span>锛�<span class="un1">浣�</span>瀹氱殑瑙勭煩锛屼粖澶╂惉杩愪腑锛�<span class="un1">涓嶈鍋峰悆</span>锛佸鏋�<span class="un1">浣�</span>鍋氫笉鍒帮紝浣犲氨<span class="un1">涓嶈兘瑕佹眰鍒汉</span>锛�<span class="un1">绗簩</span>锛佷綘鏄�<span class="un1">铓傝殎闃熼暱</span>锛屽ぇ瀹堕�変綘褰撻槦闀匡紝鏄浣犵殑<span class="un1">淇′换</span>鍜�<span class="un1">灏婇噸</span>锛佷綘鍗磋儗鐫�澶у<span class="un1">鍋峰悆</span>锛�<span class="un1">绗笁</span>锛�<span class="un1">璇氬疄瀹堜俊</span>鏄編寰凤紝浣犲悆鎺夊ザ閰<span class="un1">鎾掕皫</span>锛屾拻浜�<span class="un1">涓�涓�</span>璋庡氨瑕佺敤<span class="un1">鏃犳暟</span>鐨勮皫鏉ュ渾绗竴涓皫锛屾渶鍚�<span class="un1">杩樻槸</span>浼氳鍙戠幇锛�</p><p class="block text">铓傝殎闃熼暱锛氾紙浣庡ご锛夋垜涓嶅悆浜嗭紝鎴戠煡閬�<span class="un1">閿欎簡</span>鈥︹�﹀彲鏄紝杩欐帀鍦ㄥ湴涓婄殑濂堕叒鎬庝箞鍔炲憿锛�</p><p class="block text">濂堕叒浜猴細锛堟兂浜嗘兂锛�<span class="un1">鏈夊姙娉�</span>锛佷綘鍙互閫夋嫨澶у<span class="un1">涓�璧峰垎</span>锛屼篃鍙互閫夋嫨缁欏勾榫勬渶灏忕殑铓傝殎鍚冿紒</p><p class="block text">铓傝殎闃熼暱锛�<span class="un1">濂戒富鎰�</span>锛佹垜杩欏氨闂棶澶у锛岃阿璋綘锛�</p><p class="block text">銆愬彉鍏夛紝濂堕叒鎱㈡參鍦拌汉鍦ㄥ湴涓娿��</p><p class="block text">铓傝殎闃熼暱锛氾紙鍠婏級<span class="un1">娉ㄦ剰鍟�</span>锛佸叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝o紒</p><p class="block text">鍚戝悗杞紒榻愭璧帮紒</p><p class="block text">銆愯殏铓佷滑鐢卞洓闈㈠叓鏂硅蛋鍥炴潵銆�</p><p class="block text">铓傝殎闃熼暱锛氬ぇ瀹朵紤鎭ソ鍟︼紒鎴戞湁涓�涓�<span class="un1">鍐冲畾</span>锛�</p><p class="block text">铓傝殎浠細浠�涔堝喅瀹氾紵</p><p class="block text">铓傝殎闃熼暱锛氳繖鐐瑰効濂堕叒娓f槸鍒氭墠寮勬帀鐨勶紝涓簡鍙儨锛岋紙鎸囧悜灏忚殏铓侊級浣犳槸鎴戜滑涓勾榫勬渶灏忕殑锛�<span class="un1">浣�</span>鍚冩帀瀹冨惂锛�</p><p class="block text">銆愯殏铓佷滑榧撴帉銆�</p><p class="block text">銆愰煶涔愯捣锛屽ぇ瀹跺姴鍎挎瘮鍒氭墠鏇磋冻锛屾姮璧峰ザ閰悜灞辨礊璧板幓銆�</p><p class="block text">銆愭敹鍏夈��</p>'
+                ' <p class=" mar-l-r-4">銆愯捣鍏夛紝铓傝殎闃熼暱涓婂満銆�</p><p class=" mar-l-r-4">鍜诲捇鈥�</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀垮惞鍝嶉泦鍚堝彿锛岃殏铓佷滑杩呴�熻窇涓婂満绔欏ソ闃熷舰銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛�<span class="un1">鎴戝甯�</span>锛佷粖澶╂惉杩愮伯椋燂紝鍙<span class="un1">鍑哄姏</span>锛屼笉璁�<span class="un1">鍋峰槾</span>銆傝皝鍋峰槾灏�<span class="un1">缃氳皝</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細鏀跺埌锛�</p><p class=" mar-l-r-4">灏忚殏铓侊細锛堝榾鍜曪級瑕佹槸鍋峰槾鐨�<span class="un1">鏄偍鍛�</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙涔夋璇嶄弗锛�<span class="un1">鐓ф牱鍙楃綒</span>锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑榧撴帉銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氱◢鎭紒绔嬫锛佸鎵鹃鐗╋紒鍑哄彂锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑浜夊厛鎭愬悗鍥涘瀵婚銆�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氾紙绐佺劧锛�<span class="un1">鎶ュ憡</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氭�庝箞浜嗭紵</p><p class=" mar-l-r-4">澶уご铓傝殎锛氾紙鎸囩潃锛夎繖閲屾湁涓�鍧楀ぇ濂堕叒锛�</p><p class=" mar-l-r-4">銆愪竴鍧楀ザ閰紙婕斿憳锛夎洞鍦ㄨ钀藉銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍏村锛夊摝锛�</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯濂堕叒鐨勯鍛宠糠浣忥紝杞捣浜嗗湀鍦堛��</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛岃殏铓侀槦闀垮拰濂堕叒浜鸿烦璧蜂簡鑸炶箞銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙闄堕唹锛夊ザ閰�︹�﹀ザ閰�︹�﹀~楗辫倸瀛愪笉鍐嶅懕鍛卞彨銆傚ザ閰�︹�﹀ザ閰�︹�﹀悆涓嬩竴鍙d竴澹扮編濡欌�︹��</p><p class=" mar-l-r-4">銆愯殏铓佷滑鍋滀笅鎵嬮噷鐨勬惉杩愬伐浣滐紝鐪嬬潃闃熼暱銆�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氾紙澶у枈锛夐槦闀匡紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯鍚撻啋锛屽ザ閰汉瓒村湪鍦颁笂銆�</p><p class=" mar-l-r-4">灏忕溂闀滆殏铓侊細闃熼暱锛侀槦闀匡紒<span class="un1">蹇偣鎼繍鍚�</span>锛佽繖涔�<span class="un1">鐑�</span>鐨勫ぉ锛屽啀涓嶅嚭鍙戯紝濂堕叒灏�<span class="un1">鍖�</span>鍟︼紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氳寰楀锛佹垜鐜板湪灏�<span class="un1">鎼�</span>锛�</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯蛋鍒板ザ閰潰鍓嶄娇鍔叉姮銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬搸鍝燂紝鍝庡摕锛屽搸鍝熷摕銆�</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀夸竴娆′篃娌℃姮璧锋潵銆�</p>',
+                ' <p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙璧疯韩锛�<span class="un1">鎴戝喅瀹氫簡</span>锛佸ぇ瀹�<span class="un1">涓�璧锋惉</span>锛佽繖鍧楀ザ閰互鎴戜负棣栵紝鎼繍鐨勮矾涓�<span class="un1">涓嶈鍋峰悆</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細<span class="un1">鏄�</span>锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑杩呴�熷洿鎴愪竴鍦堬紝铓傝殎闃熼暱绔欏湪濂堕叒鏈�鍓嶉潰銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬惉鎴戝彛浠わ紒3锛�2锛�1锛佹姮锛�</p>                  <p class=" mar-l-r-4">銆愬ザ閰鎶捣銆�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氬搰锛佽繖鍧楀ザ閰�<span class="un1">濂介鍣�</span>锛�</p><p class=" mar-l-r-4">灏忕溂闀滆殏铓侊細鎴戞兂<span class="un1">鍜�</span>涓�鍙o紒</p><p class=" mar-l-r-4">灏忚殏铓侊細濡傛灉鑳�<span class="un1">鑸斾竴涓�</span>灏卞ソ浜嗭紒</p><p class=" mar-l-r-4">铓傝殎灏忓锛氭垜鐨勫彛姘存祦鍑烘潵浜嗭紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫笉璁哥瀻鎯筹紒涓嶈鍋峰悆锛�<span class="un1">鍑哄彂</span>锛�</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛岃殏铓佷滑鎶潃濂堕叒鍚戝墠璧扮潃銆�</p><p class=" mar-l-r-4">铓傝殎浠細濂堕叒锛佸ザ閰紒鎴戜滑鐨勫ザ閰紒濂堕叒锛佸ザ閰紒鎴戜滑涓�璧峰垎浜��</p><p class=" mar-l-r-4">銆愯殏铓佷滑闄堕唹涓��</p>',
+                ' <p class=" mar-l-r-4">鍢��</p><p class=" mar-l-r-4">銆愯殏铓佷滑鐢ㄥ姴杩囩寷锛屽ザ閰殑涓�涓鎺変簡銆�</p><p class=" mar-l-r-4">铓傝殎灏忓锛�<span class="un1">鍟�</span>锛侀槦闀匡紒濂堕叒鐨勮<span class="un1">鎺変簡</span>锛�</p> <p class=" mar-l-r-4">銆愬ぇ瀹剁湅鍒版帀鍦ㄥ湴涓婄殑濂堕叒銆�</p><p class=" mar-l-r-4">铓傝殎浠細鍝囧摝锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氱瓑绛夛紒</p><p class=" mar-l-r-4">銆愯垶鍙板彉鍏夛紝婕斿憳鍔ㄤ綔瀹氭牸銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氭帀浜�<span class="un1">涓�涓</span>锛岃繖璇�<span class="un1">鎬庝箞鍔�</span>锛�<span class="un1">涓㈡帀</span>锛屽疄鍦�<span class="un1">澶彲鎯�</span>锛�<span class="un1">瓒佹満鍚冩帀</span>锛屽張瑕佺姱涓嶈鍋峰槾鐨勭浠ゃ�傛�庝箞鍔炲憿锛熸湁涓姙娉曪紒鎴戣鏄�<span class="un1">鍋峰槾</span>璋佷篃<span class="un1">鐪嬩笉瑙�</span>锛�<span class="un1">杩欐牱</span>涓嶅氨琛屽暒锛佸ぇ瀹跺惉濂藉暒锛�</p>',
+                ' <p class=" mar-l-r-4">銆愯垶鍙板彉鍏夛紝婕斿憳绔嬫绔欏ソ銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫紤鎭竴浼氬効锛�</p><p class=" mar-l-r-4">铓傝殎灏忓锛�<span class="un1">涓轰粈涔�</span>瑕佷紤鎭憖锛�</p><p class=" mar-l-r-4">灏忕溂闀滆殏铓侊細闃熼暱锛佽繖鍧楁帀鍦ㄥ湴涓婄殑濂堕叒<span class="un1">鎬庝箞鍔炲憖</span>锛�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氭垜浠涓嶆妸瀹�<span class="un1">鍒嗕簡鍚�</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬惉鎴戣锛�<span class="un1">浼戞伅</span>锛�<span class="un1">绔嬪埢浼戞伅</span>锛佸ぇ瀹舵惉杩愬お杈涜嫤鍟︼紒鍒嗘暎寮�锛屽摢閲屽噳蹇氨鍒板摢閲屼紤鎭紒</p><p class=" mar-l-r-4">銆愬ぇ瀹朵緷鏃т笉鍔ㄣ��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝o紒鍚戝悗鈥旇浆锛侀綈姝モ�旇蛋锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氱珛鈥斿畾锛佸師鍦颁紤鎭紒</p><p class=" mar-l-r-4">銆愯殏铓佷滑璺熼殢鍙d护娑堝け鍦ㄨ崏涓涢噷銆�</p>',
+                ' <p class=" mar-l-r-4">銆愯殏铓侀槦闀垮悜鑽変笡閲屾湜鍘伙紝纭畾娌℃湁澹板搷銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙灏忓0锛夊樋鍢垮樋锛屽悆鎺夊悗灏辫琚鍒蛋鎴栬�呭氨璇磋鑰侀拱鍚冩帀灏卞ソ鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀夸綆涓嬪ご锛屽梾浜嗕竴涓嬪ザ閰��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬懗閬�<span class="un1">鐪�</span>棣欙紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀跨殑鎵嬩几鍚戝ザ閰福锛岀獊鐒讹紝濂堕叒浜虹珯浜嗚捣鏉ャ��</p><p class=" mar-l-r-4">銆愬彉鍏夈��</p><p class=" mar-l-r-4">濂堕叒浜猴細涓嶈鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍚撲簡涓�璺筹級浣犱綘浣狅紒浣犳�庝箞<span class="un1">绔�</span>璧锋潵鍟︼紒</p><p class=" mar-l-r-4">濂堕叒浜猴細鎴�<span class="un1">瀹炲湪</span>鐪嬩笉涓嬪幓鍟︼紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙瀹虫�曪級鏁戝懡鍝囷紒濂堕叒<span class="un1">娲�</span>鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯窇銆�</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绔欎綇</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫綘瑕佸共浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">杩欏潡</span>锛�<span class="un1">浣犱笉鑳藉悆</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫负浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绗竴</span>锛�<span class="un1">浣�</span>瀹氱殑瑙勭煩锛屼粖澶╂惉杩愪腑锛�<span class="un1">涓嶈鍋峰悆</span>锛佸鏋�<span class="un1">浣�</span>鍋氫笉鍒帮紝浣犲氨<span class="un1">涓嶈兘瑕佹眰鍒汉</span>锛�<span class="un1">绗簩</span>锛佷綘鏄�<span class="un1">铓傝殎闃熼暱</span>锛屽ぇ瀹堕�変綘褰撻槦闀匡紝鏄浣犵殑<span class="un1">淇′换</span>鍜�<span class="un1">灏婇噸</span>锛佷綘鍗磋儗鐫�澶у<span class="un1">鍋峰悆</span>锛�<span class="un1">绗笁</span>锛�<span class="un1">璇氬疄瀹堜俊</span>鏄編寰凤紝浣犲悆鎺夊ザ閰<span class="un1">鎾掕皫</span>锛屾拻浜�<span class="un1">涓�涓�</span>璋庡氨瑕佺敤<span class="un1">鏃犳暟</span>鐨勮皫鏉ュ渾绗竴涓皫锛屾渶鍚�<span class="un1">杩樻槸</span>浼氳鍙戠幇锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙浣庡ご锛夋垜涓嶅悆浜嗭紝鎴戠煡閬�<span class="un1">閿欎簡</span>鈥︹�﹀彲鏄紝杩欐帀鍦ㄥ湴涓婄殑濂堕叒鎬庝箞鍔炲憿锛�</p><p class=" mar-l-r-4">濂堕叒浜猴細锛堟兂浜嗘兂锛�<span class="un1">鏈夊姙娉�</span>锛佷綘鍙互閫夋嫨澶у<span class="un1">涓�璧峰垎</span>锛屼篃鍙互閫夋嫨缁欏勾榫勬渶灏忕殑铓傝殎鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛�<span class="un1">濂戒富鎰�</span>锛佹垜杩欏氨闂棶澶у锛岃阿璋綘锛�</p><p class=" mar-l-r-4">銆愬彉鍏夛紝濂堕叒鎱㈡參鍦拌汉鍦ㄥ湴涓娿��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍠婏級<span class="un1">娉ㄦ剰鍟�</span>锛佸叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝o紒</p><p class=" mar-l-r-4">鍚戝悗杞紒榻愭璧帮紒</p><p class=" mar-l-r-4">銆愯殏铓佷滑鐢卞洓闈㈠叓鏂硅蛋鍥炴潵銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬ぇ瀹朵紤鎭ソ鍟︼紒鎴戞湁涓�涓�<span class="un1">鍐冲畾</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細浠�涔堝喅瀹氾紵</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氳繖鐐瑰効濂堕叒娓f槸鍒氭墠寮勬帀鐨勶紝涓簡鍙儨锛岋紙鎸囧悜灏忚殏铓侊級浣犳槸鎴戜滑涓勾榫勬渶灏忕殑锛�<span class="un1">浣�</span>鍚冩帀瀹冨惂锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑榧撴帉銆�</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛屽ぇ瀹跺姴鍎挎瘮鍒氭墠鏇磋冻锛屾姮璧峰ザ閰悜灞辨礊璧板幓銆�</p><p class=" mar-l-r-4">銆愭敹鍏夈��</p>'
             ],
             activeContent: '', // 褰撳墠鏄剧ず鐨凥TML鍐呭 
             chapterData: {
@@ -391,10 +412,21 @@
                 "dd44a1e31b4304f50d10b2481a148411"
             );
             // 闊抽Md5鍦板潃
-            // this.auidoPathOne = await getResourcePath(
-            //   "2c5f6c69b0f9f7a3c03e473cb8c977f5"
-            // );
-
+            this.audioPathOne = await getResourcePath(
+                "3d00a10af86180ecafbd4de96cc1060b"
+            );
+            this.audioPathTwo = await getResourcePath(
+                "e88bbf13654fa2398f71718864a670e3"
+            );
+            this.audioPathThree = await getResourcePath(
+                "35e278e4f40f5a05d793789dc89e061a"
+            );
+            this.audioPathFour = await getResourcePath(
+                "09be0464578bb624b131628e4eb9a573"
+            );
+            this.audioPathFive = await getResourcePath(
+                "f56a9d889d3098fa6800125ae7627481"
+            );
         },
         setBookQuestion() {
             console.log("淇濆瓨");
@@ -468,8 +500,14 @@
     padding: 3% 0;
     margin: 0% 8%;
 }
-.content-wrapper{
+
+.content-wrapper {
     border: 1px solid black;
     border-radius: 10px;
 }
+/deep/.mar-l-r-4{
+    margin: 0 4%;
+    font-family: "STkaiti";
+    font-size: 19px;
+}
 </style>
\ No newline at end of file
diff --git a/src/books/artAndDrama/view/components/chapter004.vue b/src/books/artAndDrama/view/components/chapter004.vue
index 8b4faed..158b8b6 100644
--- a/src/books/artAndDrama/view/components/chapter004.vue
+++ b/src/books/artAndDrama/view/components/chapter004.vue
@@ -5,7 +5,7 @@
                 <h1 id="a004">
                     <!-- 杩欓噷鐨勫姩鍥炬湁闂锛屾病鏈夎儗鏅浘鐗� -->
                     <img class="img-0" alt="" src="../../assets/images/dy4.jpg" />
-                    <audio :src="auidoPathOne" controls class="audio"></audio>
+                    <audio :src="audioPathOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
                 </h1>
                 <div class="bodystyle">
                     <div class="bk">
@@ -146,16 +146,28 @@
                     <h2 id="b020" class="problem">鍗曞厓娲诲姩浠诲姟</h2>
                     <h3 class="lefth3" id="c039"><img class="img-gn1" alt="" src="../../assets/images/xsyty.jpg" /></h3>
                     <p class="center text1"><span class="hs">褰綋鎿嶇粌涔�</span></p>
-                    <p class="text"><span class="hs1">鈼�</span>澶撮儴杩愬姩</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>澶撮儴杩愬姩</span>
+                        <span> <audio :src="audioPathTwo" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">绗�1涓叓鎷嶏細鍙虫墜瓒婅繃澶撮《鎽稿乏鑰筹紝鍚戝彸杞昏交鍘嬪ご閮ㄣ��</p>
                     <p class="text">绗�2涓叓鎷嶏細宸︽墜瓒婅繃澶撮《鎽稿彸鑰筹紝鍚戝乏杞昏交鍘嬪ご閮ㄣ��</p>
                     <p class="text">绗�3涓叓鎷嶏細澶撮儴椤烘椂閽堣浆涓�鍦堛��</p>
                     <p class="text">绗�4涓叓鎷嶏細澶撮儴閫嗘椂閽堣浆涓�鍦堛��</p>
-                    <p class="text"><span class="hs1">鈼�</span>寮�鑲╃粌涔�</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>寮�鑲╃粌涔�</span>
+                        <span> <audio :src="audioPathThree" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鎵撳紑锛屼笌鑲╁悓瀹姐��</p>
                     <p class="text">绗�1涓叓鎷嶏細绗�1-4鎷嶆墜鑲樺唴渚у悜澶栬浆鍔紝甯﹀姩 鍙岃偐鎵撳紑锛涚5-8鎷嶆墜鑲樺唴渚у悜鍐呮敹鍥烇紝鍚庤儗鎷辫捣锛屽甫鍔ㄥ弻鑲╁唴鎵c��</p>
                     <p class="text">绗�2鑷崇4涓叓鎷嶏細閲嶅绗�1涓叓鎷嶇殑鍔ㄤ綔銆�</p>
-                    <p class="text"><span class="hs1">鈼�</span>鎻愭矇鑲╄繍鍔�</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>鎻愭矇鑲╄繍鍔�</span>
+                        <span> <audio :src="audioPathFour" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鎵撳紑锛屼笌鑲╁悓瀹姐��</p>
                 </div>
                 <!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
@@ -164,7 +176,6 @@
                     <div class="page-footer-number-right">33</div>
                 </div>
             </div>
-
         </div>
         <div class="page-box" page="37">
             <div v-if="showPageList.indexOf(37) > -1">
@@ -175,7 +186,11 @@
                 <div class="bodystyle" style="margin-top: 3%;">
                     <p class="text">绗�1鑷崇2涓叓鎷嶏細鍙屾墜涓嬪瀭锛屾墜蹇冨悜涓嬶紝鍙岃偐涓婃彁鍐嶆矇涓嬶紝涓ゆ媿涓�鍔ㄣ��</p>
                     <p class="text">绗�3鑷崇4涓叓鎷嶏細鍙屾墜涓嬪瀭锛屾墜蹇冨悜涓嬶紝宸﹀彸鑲╄唨渚濇涓婃彁鍐嶆矇涓嬶紝涓�鎷嶄竴鍔ㄣ��</p>
-                    <p class="text"><span class="hs1">鈼�</span>浼稿睍杩愬姩</p>
+                    <p class="text ends">
+                        <span><span class="hs1">鈼�</span>浼稿睍杩愬姩</span>
+                        <span> <audio :src="audioPathFive" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio> </span>
+                    </p>
                     <p class="text">韬綋鏀炬澗锛岃啙鐩栧井灞堬紝涓婅韩鑷劧寮洸涓嬫矇锛屾墜鑷傝嚜鐒朵笅鍨傘��</p>
                     <p class="text">绗�1涓叓鎷嶏細绗�1-7鎷嶈韩浣撶洿璧凤紝鍙岃噦涓捐捣锛岃府璧疯剼灏栵紱绗�8鎷嶈繕鍘熷垵濮嬬姸鎬併��</p>
                     <p class="text">绗�2鑷崇4涓叓鎷嶏細閲嶅绗�1涓叓鎷嶇殑鍔ㄤ綔銆�</p>
@@ -185,7 +200,7 @@
                     <p class="center text">
                         <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
                             x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
-                            controlslist="nodownload" class="w100 video" 
+                            controlslist="nodownload" class="w100 video"
                             style="margin-top: 40px; border-radius: 10px; border: 2px solid green;"></video>
                     </p>
                     <p class="center videoname">
@@ -230,7 +245,11 @@
             collectImg: require("../../assets/images/icon/heart.png"),
             collectCheck: require("../../assets/images/icon/heart-check.png"),
             videoPathOne: "",
-            auidoPathOne: "",
+            audioPathOne: "",
+            audioPathTwo: "",
+            audioPathThree: "",
+            audioPathFour: "",
+            audioPathFive: "",
             chapterData: {
                 isCollectImg: false,
                 isCollectVideo: false,
@@ -273,9 +292,21 @@
             this.videoPathOne = await getResourcePath(
                 "09de7704eeaaf3a210b8c6af0a94d545"
             );
-            // this.auidoPathOne = await getResourcePath(
-            //   "2c5f6c69b0f9f7a3c03e473cb8c977f5"
-            // );
+            this.audioPathOne = await getResourcePath(
+                "7c74b4da6fe6981d5c2148e48a0d66ed"
+            );
+            this.audioPathTwo = await getResourcePath(
+                "b9ce656b414814b49213a2d5838844fe"
+            );
+            this.audioPathThree = await getResourcePath(
+                "87f0de453538e671a27b9e8ffc8f34b9"
+            );
+            this.audioPathFour = await getResourcePath(
+                "e5b62ed418572b13405115020682e1cd"
+            );
+            this.audioPathFive = await getResourcePath(
+                "7abb747bd16745afb83715fcbb3579ab"
+            );
         },
         setBookQuestion() {
             console.log("淇濆瓨");
diff --git a/src/books/artAndDrama/view/components/index.vue b/src/books/artAndDrama/view/components/index.vue
index a8fa299..76a4d16 100644
--- a/src/books/artAndDrama/view/components/index.vue
+++ b/src/books/artAndDrama/view/components/index.vue
@@ -188,7 +188,7 @@
     //   txt: " 杩愬姩绯荤粺鏄敱楠ㄣ�侀杩炵粨鍜岄楠艰倢涓夐儴鍒嗙粍鎴愮殑銆傚叏韬殑楠ㄩ�氳繃楠ㄨ繛缁撶粍鎴愪汉浣撻楠硷紙瑙佸浘1-1锛夈�傞楠兼槸浜轰綋鐨勬敮鏋讹紝鍏锋湁淇濇姢鍐呰剰鍣ㄥ畼銆佷緵鑲岃倝闄勭潃鍜屼綔涓鸿倢鑲夎繍鍔ㄧ殑鏉犳潌绛変綔鐢ㄣ�傚湪绁炵粡绯荤粺鐨勬敮閰嶄笅锛岃倢鑲夋敹缂╃壍鍔ㄦ墍闄勭潃鐨勯缁曠潃鍏宠妭杞姩锛屼娇韬綋浜х敓鍚勭鍔ㄤ綔銆傛墍浠ワ紝杩愬姩绯荤粺鍏锋湁杩愬姩銆佹敮鎸佸拰淇濇姢绛夊姛鑳斤紝骞煎勾鏃舵湡鐨勯楠艰繕鍏锋湁閫犺鍔熻兘銆� ",
     //   txtIndex: 57
     // });
-    //  }, 500);
+    // }, 500);
   },
   methods: {
     // setZoom1() {

--
Gitblit v1.9.1