From ac9d75d4d82039ba62c7d438ca5564f7049cc343 Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期二, 16 七月 2024 09:25:29 +0800
Subject: [PATCH] Merge branches 'master' and 'master' of http://182.92.203.7:2001/r/testbookLayout

---
 src/books/English/view/components/chapter004.vue | 1724 +++++++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 files changed, 1,595 insertions(+), 129 deletions(-)

diff --git a/src/books/English/view/components/chapter004.vue b/src/books/English/view/components/chapter004.vue
index 1a99f0b..cabc496 100644
--- a/src/books/English/view/components/chapter004.vue
+++ b/src/books/English/view/components/chapter004.vue
@@ -21,7 +21,7 @@
             </div>
         </div>
         <!-- 59 -->
-        <!-- <div class="page-box" page="65">
+        <div class="page-box" page="65">
             <div v-if="showPageList.indexOf(65) > -1">
 
                 <ul class="preface-odd-header w100 fl ju-bt">
@@ -32,7 +32,7 @@
                             VOLUNTEERS</span>
                     </li>
                 </ul>
-            
+
                 <div class="padding-93">
                     <div class="bodystyle">
                         <h2 id="b013"><img class="img-0" alt="" src="../../assets/images/dy4-le1.jpg" /></h2>
@@ -43,32 +43,374 @@
                             <p>robot floor cleaner銆�self-balancing scooter銆�camera drone銆�smartwatch銆�fingerprint door
                                 lock銆�VR headset</p>
                         </div>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-1.jpg" /></p>
-                        <p class="center">1._____________________</p>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-2.jpg" /></p>
-                        <p class="center">2._____________________</p>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-3.jpg" /></p>
-                        <p class="center">3._____________________</p>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-4.jpg" /></p>
-                        <p class="center">4._____________________</p>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-5.jpg" /></p>
-                        <p class="center">5._____________________</p>
-                        <p class="center"><img class="img-e" alt="" src="../../assets/images/0069-6.jpg" /></p>
-                        <p class="center">6._____________________</p>
+                        <ul class="fl fw-wr dropdown-box-one" >
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-1.jpg" /></p>
+                                <p class="center">1.
+                                    <select class="select-border" v-model="warmUp[0].value[0].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[0].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[0].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-2.jpg" /></p>
+                                <p class="center">2.
+                                    <select class="select-border" v-model="warmUp[0].value[1].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[1].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[1].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-3.jpg" /></p>
+                                <p class="center">3.
+                                    <select class="select-border" v-model="warmUp[0].value[2].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[2].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[2].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-4.jpg" /></p>
+                                <p class="center">4.
+                                    <select class="select-border" v-model="warmUp[0].value[3].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[3].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[3].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-5.jpg" /></p>
+                                <p class="center">5.
+                                    <select class="select-border" v-model="warmUp[0].value[4].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[4].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[4].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                            <li>
+                                <p class="center"><img class="w80" alt="" src="../../assets/images/0069-6.jpg" /></p>
+                                <p class="center">6.
+                                    <select class="select-border" v-model="warmUp[0].value[5].userAnswer" @change="savewarmUp"
+                                        :disabled="warmUp[0].isComplete">
+                                        <option v-for="(item, index) in warmUp[0].options" :key="index" :value="item">
+                                        {{ item }}
+                                        </option>
+                                    </select>
+                                    <span class="icon-box" v-if="warmUp[0].isComplete">
+                                        <svg v-if="warmUp[0].value[5].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>
+                                        </svg>
+                                        <svg v-if="warmUp[0].value[5].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>
+                                        </svg>
+                                    </span>
+                                </p>
+                            </li>
+                        </ul>
+                        <div class="event-header-text-bc pd-5 w100 mt-20"
+                            v-if="warmUp[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item,index) in warmUp[0].value" :key="index" class="mr-20">
+                                {{index + 1}}.{{ item.answer }}
+                            </span>
+                        </div>
                         <p><b>鈪�.Read the following descriptions of the items in the above pictures,and then put the
                                 number of the corresponding picture in the blanks.</b></p>
-                        <p class="center"><img class="img-0" alt="" src="../../assets/images/0069-7.jpg" /></p>
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-16">
+                            <tr>
+                                <td>1. It takes pictures of the world from the sky.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[0].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[0].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[0].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>2. It allows us to open the door with fingertips.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[1].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[1].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[1].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>3. It cleans the foor of your room.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[2].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[2].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[2].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>4. It allows you to experience amazing places of the world without leaving home.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[3].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[3].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[3].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>5. It works as your personal transporter, and takes you from one place to another.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[4].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[4].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[4].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>6. It can not only tell time but also keep track of your ftness.</td>
+                                <td>
+                                    <input type="text" :disabled="warmUp[1].isComplete" v-model="warmUp[1].value[5].userAnswer" class="input-bottom-border input-bc-t" @input="savewarmUp" style="width:80px"> 
+                                    <span class="icon-box" v-if="warmUp[1].isComplete">
+                                        <svg v-if="warmUp[1].value[5].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>
+                                        </svg>
+                                        <svg v-if="warmUp[1].value[5].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>
+                                        </svg>
+                                    </span>
+                                </td>
+                            </tr>
+                        </table>
+                        <div class="event-header-text-bc pd-5 w100 mt-20"
+                            v-if="warmUp[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item,index) in warmUp[1].value" :key="index" class="mr-20">
+                                {{ item.answer }}
+                            </span>
+                        </div>
+                       <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handlewarmUp">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastwarmUp" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewwarmUp" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
                     <span class="contet-num-box">59</span>
                 </div>
             </div>
-        </div> -->
+        </div>
         <!-- 60 -->
-        <!-- <div class="page-box" page="66">
+        <div class="page-box" page="66">
             <div v-if="showPageList.indexOf(66) > -1">
-        
+
                 <div class="w100 mb-20" style="padding-right: 20px">
                     <div class="event-header-bc-unit4 fl al-end" style="height: 100px; padding-left: 40px">
                         <div class="preface-header-box event-header-text-bc-unit4">
@@ -80,30 +422,54 @@
 
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <h3 id="c029"><span class="bjh3">Listening</span></h3>
+                        <h3 id="c029" class="fl al-cn">
+                            <span class="bjh3">Listening</span>
+                            <!--controlslist="noplaybackrate nodownload"鍚庨潰鐨勯煶棰戞鍔犲叆杩欎釜-->
+                            <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio>
+                        </h3>
+
                         <p><b>Listen to the conversation between Tony and Zhang Ping and match the sentence halves.</b>
                         </p>
-                        <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"
-                            @play="audioPlay"></audio>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0070-2.jpg" /></p>
+                        <matching :rawData="rawData" :question="question"></matching>
                         <h3 id="c030"><span class="bjh3">Reading</span></h3>
                         <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"
-                            @play="audioPlay"></audio>
+                            ></audio>
                         <p>1.Technology is all around us.What images spring to your mind when you hear the word 鈥渞obot鈥�?
-                        </p>
+                        </p> 
+                        <textarea name="" id="" cols="30" rows="10" class="w100" v-model="noSubmitData[0].value[0].userAnswer" @input="saveNoSubmitData"></textarea>
                         <p>2.How can robots help humans today in daily life and work?</p>
+                        <textarea name="" id="" cols="30" rows="10" class="w100" v-model="noSubmitData[0].value[1].userAnswer" @input="saveNoSubmitData"></textarea>
                         <p class="center"><b>Robots in Action</b></p>
+                        <p class="center">
+                            <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload"
+                                class="audio" ></audio>
+                        </p>
                         <p>Robots are on the rise! Today they can be found working in hotels and stores.Machines will
-                            soon be used to study sea creatures up close.These robots can blend right in with underwater
-                            habitats.Robots take on tasks to make our life easier and safer.Scientists keep coming up
+                            soon be used to study sea
+
+                            <span class="word-bc" @click="saveWord($event, 'creatures')">creatures</span>
+                            up close.These robots can
+                            <span class="word-bc" @click="saveWord($event, 'blend')">blend</span>
+                            blend right in with underwater
+                            <span class="word-bc" @click="saveWord($event, 'habitats')">habitats</span>
+                            .Robots take on tasks to make our life easier and safer.Scientists keep coming up
                             with jobs that machines can do.Sometimes,the machines can do a better job than humans.Take a
-                            look at the latest robots.</p>
+                            look at the latest robots.
+                        </p>
                         <p><b>Super Swimmer</b></p>
-                        <p>The Octobot is perfectly named.Its design is based on the octopus.The robot is the size of a
+                        <p>The Octobot is perfectly named.Its design is based on the
+                            <span class="word-bc" @click="saveWord($event, 'octopus')">octopus</span>
+                            .The robot is the size of a
                             shoebox.It can blend in with its underwater surroundings.The Octobot can travel at seven
                             inches per second.That is close to the speed of an octopus.The Octobot moves through water
-                            by slowly opening its soft rubber arms and then snapping them shut.During tests,fish swam
-                            alongside the Octobot.Researchers can use the robot to study sea creatures.</p>
+                            by slowly opening its soft
+                            <span class="word-bc" @click="saveWord($event, 'rubber')">rubber</span>
+                            arms and then
+                            <span class="word-bc" @click="saveWord($event, 'snapping')"> snapping</span>
+                            them shut.During tests,fish swam
+                            alongside the Octobot.Researchers can use the robot to study sea creatures.
+                        </p>
                         <p class="center"><img class="img-f" alt="" src="../../assets/images/0070-4.jpg" /></p>
                     </div>
                 </div>
@@ -128,30 +494,51 @@
                 <div class="padding-93">
                     <div class="bodystyle">
                         <p><b>See Spot Run</b></p>
-                        <p>Spot looks and moves much like a real dog.But don鈥檛 expect it to play fetch.Boston Dynamics
-                            created the four-legged,160-pound mechanical dog.It can climb mountains.It can cross
+                        <p>Spot looks and moves much like a real dog.But don鈥檛 expect it to play
+                            <span class="word-bc" @click="saveWord($event, 'fetch')">fetch</span>
+                            .Boston Dynamics
+                            created the four-legged,160-pound
+                            <span class="word-bc" @click="saveWord($event, 'mechanical')">mechanical</span>
+                            dog.It can climb mountains.It can cross
                             woods.It can go upstairs.Spot can also keep itself from falling over if it loses its
-                            balance.In the future,Spot may be used for search-and-rescue missions and to carry heavy
-                            facilities.</p>
+                            <span class="word-bc" @click="saveWord($event, 'balance')">balance</span>
+                            .In the future,Spot may be used for search-and-
+                            <span class="word-bc" @click="saveWord($event, 'rescue')">rescue</span>
+                            <span class="word-bc" @click="saveWord($event, 'missions')">missions</span>
+                            and to carry heavy
+                            <span class="word-bc" @click="saveWord($event, 'facilities')">facilities</span>
+                            .
+                        </p>
                         <p class="center"><img class="img-f" alt="" src="../../assets/images/0071-3.jpg" /></p>
                         <p><b>Hotel Helper</b></p>
                         <p class="center"><img class="img-f" alt="" src="../../assets/images/0071-2.jpg" /></p>
                         <p>No towels? No problem! At the Crowne Plaza in the Dishuihu area of Shanghai,Mingo robot is on
                             the job.The three-foot-tall robot has been making deliveries to guest rooms.When a guest
-                            asks for an item,a clerk places it in Mingo鈥檚 lid and enters the room number onto a
-                            screen.Guests are always very excited when Mingo arrives with a delivery.</p>
+                            asks for an item,a clerk places it in Mingo鈥檚
+                            <span class="word-bc" @click="saveWord($event, 'lid')">lid</span>
+                            and enters the room number onto a
+                            screen.Guests are always very excited when Mingo arrives with a delivery.
+                        </p>
                         <p><b>Big in Japan</b></p>
-                        <p>In Japan,scientists are leading the way in creating humanoid robots.SoftBank introduced
-                            Pepper,a four-foot-tall robot who can talk with humans and react to emotions.If you
-                            frown,Pepper will try to cheer you up.The robot is being used in stores.But SoftBank has
-                            bigger plans for Pepper.It may one day keep humans company and help teach children.</p>
+                        <p>In Japan,scientists are leading the way in creating
+                            <span class="word-bc" @click="saveWord($event, 'humanoid')">humanoid</span>
+                            robots.SoftBank introduced
+                            Pepper,a four-foot-tall robot who can talk with humans and
+                            <span class="word-bc" @click="saveWord($event, 'react')">react</span>
+                            to emotions.If you
+                            <span class="word-bc" @click="saveWord($event, 'frown')">frown</span>
+                            ,Pepper will try to cheer you up.The robot is being used in stores.But SoftBank has
+                            bigger plans for Pepper.It may one day keep humans
+                            <span class="word-bc" @click="saveWord($event, 'company')">company</span>
+                            and help teach children.
+                        </p>
                         <p class="center"><img class="img-f" alt="" src="../../assets/images/0071-1.jpg" /></p>
                         <p class="fl al-cn mt-40">
                             <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
                             <span class="line-border-box"></span>
                         </p>
-                        <p class="center"> <audio :src="resource.listenOne" controls
-                                controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio></p>
+                        <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"
+                            ></audio>
                         <p>creature /藞kri藧t蕛蓹(r)/ <i>n.</i> 鐢熺墿锛涳紙灏ゆ寚锛� 鍔ㄧ墿</p>
                         <div class="bkbj">
                             <p><i>a living thing that can move around,such as an animal</i></p>
@@ -252,8 +639,48 @@
                         <p><b>鈪�.Reading comprehension.</b></p>
                         <p>A.Read the passage and complete the summary.</p>
                         <p>Nowadays,there has been a rapid increase in the use of robots in different areas.They make
-                            people鈥檚 lives 1._________.Sometimes,machines can perform better than humans.There are four
-                            examples of the latest robots.Octobot is designed to study 2._________,which can blend in
+                            people鈥檚 lives 1.
+                            <input type="text" :disabled="readingOne[0].isComplete" v-model="readingOne[0].value[0].userAnswer" class="input-bottom-border input-bc-t" @input="saveReadingOne" style="width:80px"> 
+                            <span class="icon-box" v-if="readingOne[0].isComplete">
+                                <svg v-if="readingOne[0].value[0].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>
+                                </svg>
+                                <svg v-if="readingOne[0].value[0].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>
+                                </svg>
+                            </span>
+                            .Sometimes,machines can perform better than humans.There are four
+                            examples of the latest robots.Octobot is designed to study 2.
+                            <input type="text" :disabled="readingOne[0].isComplete" v-model="readingOne[0].value[1].userAnswer" class="input-bottom-border input-bc-t" @input="saveReadingOne" style="width:80px"> 
+                            <span class="icon-box" v-if="readingOne[0].isComplete">
+                                <svg v-if="readingOne[0].value[1].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>
+                                </svg>
+                                <svg v-if="readingOne[0].value[1].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>
+                                </svg>
+                            </span>
+                            ,which can blend in
                             with its underwater surroundings.Spot is a mechanical dog which may</p>
                     </div>
                 </div>
@@ -277,10 +704,78 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p> be used for 3._________missions.Mingo could be found in hotels making 4._________.A humanoid
-                            robot Pepper has been created to communicate with humans and react to 5._________.</p>
+                        <p> be used for 3.
+                            <input type="text" :disabled="readingOne[0].isComplete" v-model="readingOne[0].value[2].userAnswer" class="input-bottom-border input-bc-t" @input="saveReadingOne" style="width:80px"> 
+                            <span class="icon-box" v-if="readingOne[0].isComplete">
+                                <svg v-if="readingOne[0].value[2].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>
+                                </svg>
+                                <svg v-if="readingOne[0].value[2].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>
+                                </svg>
+                            </span>
+                            missions.Mingo could be found in hotels making 4.
+                            <input type="text" :disabled="readingOne[0].isComplete" v-model="readingOne[0].value[3].userAnswer" class="input-bottom-border input-bc-t" @input="saveReadingOne" style="width:80px"> 
+                            <span class="icon-box" v-if="readingOne[0].isComplete">
+                                <svg v-if="readingOne[0].value[3].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>
+                                </svg>
+                                <svg v-if="readingOne[0].value[3].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>
+                                </svg>
+                            </span>
+                            .A humanoid
+                            robot Pepper has been created to communicate with humans and react to 5.
+                            <input type="text" :disabled="readingOne[0].isComplete" v-model="readingOne[0].value[4].userAnswer" class="input-bottom-border input-bc-t" @input="saveReadingOne" style="width:80px"> 
+                            <span class="icon-box" v-if="readingOne[0].isComplete">
+                                <svg v-if="readingOne[0].value[4].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>
+                                </svg>
+                                <svg v-if="readingOne[0].value[4].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>
+                                </svg>
+                            </span>
+                            .</p>
                         <p>B.Match the four types of robots introduced in the passage with the descriptions below.</p>
                         <p class="center"><img class="img-a" alt="" src="../../assets/images/0073-1.jpg" /></p>
+                        <p>1. It moves like a real dog.</p>
+                        <p>2. It could be found in stores.</p>
+                        <p>3. It is the size of a shoebox.</p>
+                        <p>4. It can carry heavy facilities.</p>
+                        <p>5. It will cheer you up if you frown.</p>
+                        <p>6. It can bring guests small items to their rooms.</p>
+                        <p>7. It's about three-foot-tall with a screen on the top.</p>
+                        <p>8. It travels close to the speed of an octopus in the water.</p>
                         <p><b>鈪�.Language focus.</b></p>
                         <p>A.Fill in the blanks with the proper form of the words given below.</p>
                         <div class="bk-wh">
@@ -312,7 +807,7 @@
         </div>
         <!-- 64 -->
         <div class="page-box" page="70">
-            <div v-if="showPageList.indexOf(71) > -1">
+            <div v-if="showPageList.indexOf(70) > -1">
                 <!-- 澶撮儴 -->
                 <div class="w100 mb-20" style="padding-right: 20px">
                     <div class="event-header-bc-unit4 fl al-end" style="height: 100px; padding-left: 40px">
@@ -333,9 +828,59 @@
                         <p>__________________________________________________</p>
                         <p>4.Food processors are great tools for blending vegetables and fruits.</p>
                         <p>__________________________________________________</p>
-                        <p><b>鈪�.Grammar focus:The comparative degree.</b></p>
+                        <p><b>鈪�.Grammar focus:The comparative degree.</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">
+                                    <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>
+                                </svg>
+                            </span>
+                        </p>
+                        <div class="openImgBox" v-if="showImg">
+                            <img class="w100" :src="imgThirteen" />
+                        </div>
                         <p>A.Write the comparative form for each word below.</p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0074-1.jpg" /></p>
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+                            <tr class="table-tr-bc">
+                                <td class="tl-lf" style="width: 33%;">l. often 鈫�<input :disabled="testData.isComplete"
+                                        type="text" class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf" style="width: 33%;">2. go0d 鈫�<input :disabled="testData.isComplete"
+                                        type="text" class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf" style="width: 33%;">3. bad 鈫�<input :disabled="testData.isComplete"
+                                        type="text" class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" />
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc ">
+                                <td class="tl-lf">4. early 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf">5. heavy 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf">6. late 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" />
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-lf">7. dangerous 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf">8. thin 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" /></td>
+                                <td class="tl-lf">9. far 鈫�<input :disabled="testData.isComplete" type="text"
+                                        class="input-bottom-border input-bc-t" style="width: 5em"
+                                        v-model="testData.in.one" @change="setTestData" />
+                                </td>
+                            </tr>
+                        </table>
                         <p>B.Fill in the blanks with the correct comparatives from the above.</p>
                         <p>1.The new car model may be launched _______ than expected.</p>
                         <p>2.The higher we go above the earth,the _______ the air is.</p>
@@ -376,11 +921,204 @@
                 <div class="padding-93">
                     <div class="bodystyle">
                         <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" /></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0075-1.jpg" /></p>
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">The differences between humanoid robotsand human beings
+                                </td>
+                                <td class="tl-lf">
+                                    <p class="table-p">l. Humans are organic beings, yhile robots are not.</p>
+                                    <textarea v-model="questionData.table.nineteen"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">
+                                    The things that robots can't do but humans
+                                </td>
+                                <td>
+                                    <p class="table-p">1. Do creative work.</p>
+                                    <textarea v-model="questionData.table.nineteen"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">
+                                    The functions of your designed robot
+                                </td>
+                                <td>
+                                    <p class="table-p">1. Fold clothes for you.</p>
+                                    <textarea v-model="questionData.table.nineteen"
+                                        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" /></p>
                         <div class="bk-wh">
-                            <p>physical銆�complex銆�social銆�relationship銆�feeling銆�emotion銆�empathy銆�thought銆�tireless銆�creative
+                            <p class="dl-box">
+                                <span class="word-bc mr-20 dl-span"
+                                    @click="saveWord($event, 'physical')">physical</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'complex')">complex</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'social')">social</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    @click="saveWord($event, 'relationship')">relationship</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'feeling')">feeling</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'emotion')">emotion</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'empathy')">empathy</span>
+                                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'thought')">thought</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    @click="saveWord($event, 'tireless')">tireless</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    @click="saveWord($event, 'creative')">creative</span>
                             </p>
+                            <p>銆�銆�銆�銆�銆�銆�銆�銆�銆�
+                            </p>
+                        </div>
+                        <div class="resource-primary-border" style="padding: 8px; margin: 5% 0%">
+                            <div class="banshi openImgBox">
+                                <div class="swiper-container swiper_ppt">
+                                    <div class="swiper-wrapper">
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_01.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_02.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_03.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_04.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_05.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_06.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_07.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_08.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_09.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_10.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_11.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_12.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_13.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_14.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_15.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_16.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_17.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_18.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_19.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_20.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_21.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_22.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_23.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_24.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_25.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_26.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_27.png" />
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="swiper-button-next"></div>
+                                    <div class="swiper-button-prev"></div>
+                                    <div class="pageBox"></div>
+                                </div>
+                                <!-- 鏄剧ず褰撳墠椤靛拰鎬婚〉鏁扮殑鍏冪礌 -->
+                            </div>
                         </div>
                         <h2 id="b014"><img class="img-0" alt="" src="../../assets/images/dy4-le2.jpg" /></h2>
                         <h3 id="c032"><span class="bjh3">Warm-up</span></h3>
@@ -450,18 +1188,23 @@
                         <p><i>It appears that most students</i>鈥�</p>
                         <p><i>What surprised me is that</i>鈥�</p>
                         <h3 id="c033"><span class="bjh3">Reading</span></h3>
-                        <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"
-                            @play="audioPlay"></audio>
                         <p>1.Are you amazed by the stars in the night sky,wondering what brought life into existence?
                         </p>
                         <p>2.What is your dream about space exploration?</p>
                         <p class="center"><b>Fresh Face of Science</b></p>
+                        <p class="center"> <audio :src="resource.listenOne" controls
+                                controlslist="noplaybackrate nodownload" class="audio" ></audio></p>
                         <p class="center"><img class="img-e" alt="" src="../../assets/images/0076-2.jpg" /></p>
-                        <p>According to Zhao Hongzhou,founder of China鈥檚 scientometrics,scientists typically make their
+                        <p>According to Zhao Hongzhou,founder of China鈥檚
+                            <span class="word-bc" @click="saveWord($event, 'scientometrics')">scientometrics</span>
+                            ,scientists typically make their
                             biggest achievements between the ages of 25 and 45,which is true of the scientists and
-                            engineers working on FAST(Five-hundred-meter Aperture Spherical Telescope).Its engineering
+                            engineers working on FAST(Five-hundred-meter Aperture Spherical
+                            <span class="word-bc" @click="saveWord($event, 'Telescope')">Telescope</span>
+                            ).Its engineering
                             and operation team has an average age of 39,while its on-site team has an average age of
-                            30.Meanwhile,the scientific spirit these young scientists have shown is also moving.</p>
+                            30.Meanwhile,the scientific spirit these young scientists have shown is also moving.
+                        </p>
                         <p>As the world鈥檚 largest radio telescope,it has been </p>
                     </div>
                 </div>
@@ -485,38 +1228,66 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>quite helpful in the discovery of around 340 pulsars,since becoming operational in September
-                            2016.It has also contributed to helping human beings better understand the origin of fast
-                            radio
-                            bursts,extremely brief but powerful flashes in the universe.FAST was listed by the journals
+                        <p>quite helpful in the discovery of around 340
+                            <span class="word-bc" @click="saveWord($event, 'pulsars')">pulsars</span>
+                            ,since becoming operational in September
+                            2016.It has also contributed to helping human beings better understand the
+                            <span class="word-bc" @click="saveWord($event, 'origin')">origin</span>
+                            of fast radio
+                            <span class="word-bc" @click="saveWord($event, 'bursts')">bursts</span>
+                            ,extremely brief but powerful flashes in the
+                            <span class="word-bc" @click="saveWord($event, 'universe')">universe</span>
+                            .FAST was listed by the journals
                             <i>Nature</i> and<i> Science</i> as one of the biggest scientific discoveries of 2020.
                         </p>
-                        <p>The construction of FAST pushed the team to its physical and intellectual limits,including
+                        <p>The construction of FAST pushed the team to its physical and
+                            <span class="word-bc" @click="saveWord($event, 'intellectual')">intellectual </span>
+                            limits,including
                             creating new systems to operate the telescope,also known as the 鈥淪ky Eye鈥�.At the age of
-                            28,Yao Rui,a researcher behind FAST鈥檚 feed cabin,was responsible for creating the 鈥減upil鈥� of
+                            28,Yao Rui,a researcher behind FAST鈥檚 feed
+                            <span class="word-bc" @click="saveWord($event, 'cabin')">cabin</span>
+                            ,was responsible for creating the 鈥�
+                            <span class="word-bc" @click="saveWord($event, 'pupil')">pupil</span>鈥� of
                             the 鈥淪ky Eye鈥� after joining the team.Some of her most challenging tasks involved downsizing
                             the cabin鈥檚 weight from 34 to 30 tons,while keeping most of the systems inside and leaving
-                            enough room to fill it with as much complex and sensitive equipment as possible.Yao鈥檚
-                            solution was to change the shape of the cabin to a diamond structure.The redesign was
-                            daring,but later testing proved that it worked perfectly.鈥淚鈥檓 not worried about
+                            enough room to fill it with as much
+                            <span class="word-bc" @click="saveWord($event, 'complex')">complex</span>
+                            and sensitive equipment as possible.Yao鈥檚
+                            solution was to change the shape of the cabin to a
+                            <span class="word-bc" @click="saveWord($event, 'diamond')">diamond</span>
+                            structure.The redesign was
+                            <span class="word-bc" @click="saveWord($event, 'daring')">daring</span>
+                            ,but later testing proved that it worked perfectly.鈥淚鈥檓 not worried about
                             problems,because wherever there is a problem,there is a chance for further research,鈥� she
                             said.鈥淎s a young scientist,I am lucky to associate my personal passions with the needs of
-                            the nation,so I can improve and grow together with the country.鈥�</p>
+                            the nation,so I can improve and grow together with the country.鈥�
+                        </p>
                         <p>Sun Jinghai,a 38-year-old researcher of FAST,was involved in perfecting and protecting the
                             giant machine.Nan Rendong,FAST鈥檚 former chief scientist,often stressed that FAST not only
-                            needed to be precise and sensitive in its applications,but it should also be beautiful to
+                            needed to be
+                            <span class="word-bc" @click="saveWord($event, 'precise')">precise</span>
+                            and sensitive in its applications,but it should also be beautiful to
                             look at.鈥淗e expected nothing less of an instrument of national significance,鈥� Sun said.He
                             spent 15 years on FAST,and,in return,FAST helped him to grow,increased his knowledge,and
-                            rewarded him with confidence as he overcame many difficulties and setbacks.</p>
-                        <p>The 鈥淪ky Eye鈥� is open to the world and offers more observation possibilities to the global
-                            scientific community,contributing Chinese wisdom to building a community of a shared future
-                            for humanity.</p>
+                            <span class="word-bc" @click="saveWord($event, 'rewar')">rewar</span>
+                            ded him with confidence as he
+                            <span class="word-bc" @click="saveWord($event, 'overcame')">overcame</span>
+                            many difficulties and setbacks.
+                        </p>
+                        <p>The 鈥淪ky Eye鈥� is open to the world and offers more
+                            <span class="word-bc" @click="saveWord($event, 'observation')">observation</span>
+                            possibilities to the global
+                            scientific
+                            <span class="word-bc" @click="saveWord($event, 'community')">community</span>
+                            ,contributing Chinese wisdom to building a community of a shared future
+                            for humanity.
+                        </p>
                         <p class="fl al-cn mt-40">
                             <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
                             <span class="line-border-box"></span>
                         </p>
-                        <p class="center"> <audio :src="resource.listenOne" controls
-                                controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio></p>
+                        <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio"
+                            ></audio>
                         <p>scientometrics /藞sa瑟蓹nt蓹蕣藞metr瑟ks/ <i>n.</i> 绉戝璁¢噺瀛�</p>
                         <div class="bkbj">
                             <p><i>the science of measuring and analyzing science</i></p>
@@ -651,7 +1422,65 @@
                         <div class="bk-wh">
                             <p>15銆�28銆�30銆�38銆�39銆�340銆�2016</p>
                         </div>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0079-1.jpg" /></p>
+                        <p class="center">
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">The FAST Team</td>
+                                <td style="width: 65%;">
+                                    <p class="table-p">
+                                        The engineering and operation team has an average age of 1.<select
+                                            v-model="dropdownData.one.value" style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>
+                                        while the on-site team has an average age of 2.<select
+                                            v-model="dropdownData.one.value" style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>
+                                    </p>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">Achievements</td>
+                                <td style="width: 65%;">
+                                    <p class="table-p">He would like to provide the world's 5.<select
+                                            v-model="dropdownData.one.value" style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>least developed countries
+                                        with engineers.</p>
+                                    <p class="table-p">He wants to reach 6.<select v-model="dropdownData.one.value"
+                                            style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>people.</p>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">Contributions ofTeam Members</td>
+                                <td style="width: 65%;">
+                                    <p class="table-p">He would like to provide the world's 5.<select
+                                            v-model="dropdownData.one.value" style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>least developed countries
+                                        with engineers.</p>
+                                    <p class="table-p">He wants to reach 6.<select v-model="dropdownData.one.value"
+                                            style="width: 25%">
+                                            <option v-for="(item, index) in dropDownListOne" :key="index" :value="item">
+                                                {{ item }}
+                                            </option>
+                                        </select>people.</p>
+                                </td>
+                            </tr>
+                        </table>
+                        </p>
                         <p>B.Decide whether the following statements are true (T) or false (F).</p>
                         <p>(銆�) 1.According to Zhao Hongzhou鈥檚 analysis,scientists usually make their greatest
                             achievements before the age of 45.</p>
@@ -704,7 +1533,20 @@
                             _______ it.</p>
                         <p>4.All drivers _______ their vehicles鈥攅ven when it鈥檚 a self-driving car accident.</p>
                         <p>5.Studies show how customers can _______ innovation development by giving feedback.</p>
-                        <p><b>鈪�.Grammar focus:The superlative degree.</b></p>
+                        <p><b>鈪�.Grammar focus:The superlative degree.</b>
+                            <span class="btn-box" @click="showAnswer('showImgOne')">
+                                <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>
+                                </svg>
+                            </span>
+                        </p>
+                        <div class="openImgBox" v-if="showImgOne">
+                            <img class="w100" :src="imgThirteenOne" />
+                        </div>
                         <p>Complete the sentences with the superlative form of the words in the brackets.</p>
                         <p>1.He is probably the _______ (creative) designer in our company.</p>
                         <p>2.This automated store offers the _______ (wide) variety of products.</p>
@@ -741,13 +1583,222 @@
                             technology,the improvement of people鈥檚 lives,and the development of the Chinese nation.Work
                             in groups and list some great Chinese scientists and their contributions to the world,and
                             then discuss with your group members about their spirit towards scientific research and
-                            innovation.</p>
+                            innovation.
+                        </p>
                         <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" /></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0081-2.jpg" /></p>
+
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+                            <tr class="table-th-bc">
+                                <td class="tl-cn">Scientists</td>
+                                <td class="tl-cn">Contributions</td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn">Zhang Heng</td>
+                                <td class="tl-lf">
+                                    He invented a machine called seismometer(鍦板姩浠�), which could sense distant
+                                    earthquakes,
+                                    and indicated in which direction they were happening.
+                                </td>
+                            </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>
+                                </td>
+                                <td>
+                                    <textarea v-model="questionData.table.two"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </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>
+                                </td>
+                                <td>
+                                    <textarea v-model="questionData.table.two"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </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>
+                                </td>
+                                <td>
+                                    <textarea v-model="questionData.table.two"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </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>
+                                </td>
+                                <td>
+                                    <textarea v-model="questionData.table.two"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                </td>
+                            </tr>
+                        </table>
+                        <div class="resource-primary-border" style="padding: 8px; margin: 5% 0%">
+                            <div class="banshi openImgBox">
+                                <div class="swiper-container swiper_ppt">
+                                    <div class="swiper-wrapper">
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_01.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_02.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_03.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_04.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_05.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_06.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_07.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_08.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_09.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_10.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_11.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_12.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_13.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_14.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_15.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_16.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_17.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_18.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_19.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_20.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_21.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_22.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_23.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_24.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_25.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_26.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_27.png" />
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="swiper-button-next"></div>
+                                    <div class="swiper-button-prev"></div>
+                                    <div class="pageBox"></div>
+                                </div>
+                                <!-- 鏄剧ず褰撳墠椤靛拰鎬婚〉鏁扮殑鍏冪礌 -->
+                            </div>
+                        </div>
                         <h2 id="b015"><img class="img-0" alt="" src="../../assets/images/dy4-le3.jpg" /></h2>
-                        <h3 id="c035"><span class="bjh3">Listening</span></h3>
-                        <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload"
-                            style="margin-left: 10px" class="audio" @play="audioPlay"></audio>
+                        <h3 id="c035" class="fl al-cn">
+                            <span class="bjh3">Listening</span>
+                            <!--controlslist="noplaybackrate nodownload"鍚庨潰鐨勯煶棰戞鍔犲叆杩欎釜-->
+                            <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio>
+                        </h3>
                         <p><b>鈪�.Listen to Nadia talking about her favorite electronic device and mark what she says
                                 about it.</b></p>
                         <p>鈻� 1.What it is</p>
@@ -780,7 +1831,78 @@
                         <p>鈻� 6.Why it is important to Nadia</p>
                         <p><b>鈪�.Ms.Zhang is discussing technology trends with her students.Listen to the
                                 conversation,and write down the benefits of each App.</b></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0082-1.jpg" /></p>
+                        <p class="center">
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+                            <tr class="table-th-bc">
+                                <td class="tl-cn">Artificial Inteligence Apps</td>
+                                <td class="tl-cn">Benefits</td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn">
+                                    digital assistance
+                                </td>
+                                <td class="tl-lf">
+                                    <p class="table-p">
+                                        It reminds me to do things.
+                                    </p>
+                                    <p class="table-p">
+                                        It wakes me up 1<input :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />in the morning.
+                                    </p>
+                                    <p class="table-p">
+                                        It plays my 2.<input :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />music.
+                                    </p>
+                                    <p class="table-p">
+                                        I chat with it when I am alone..
+                                    </p>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn">
+                                    online shopping recommendation
+                                </td>
+                                <td class="tl-lf">
+                                    <p class="table-p">
+                                        It 3.<input :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />suggests things that I
+                                        want.
+                                    </p>
+                                    <p class="table-p">
+                                        It makes shopping a 4.<input :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />experience.
+                                    </p>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn">
+                                    instant translation
+                                </td>
+                                <td class="tl-lf">
+                                    <p class="table-p">
+                                        They help me communicate easily when I travel abroad.
+                                    </p>
+                                    <p class="table-p">
+                                        They're so 5.<input :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />for foreign language
+                                        learning.
+                                    </p>
+                                    <p class="table-p">
+                                        I can figure out words or the meaning of words 6.<input
+                                            :disabled="testData.isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 5em"
+                                            v-model="testData.in.one" @change="setTestData" />
+                                    </p>
+                                </td>
+                            </tr>
+                        </table>
+
+                        </p>
                         <h3 id="c036"><span class="bjh3">Practical Writing</span></h3>
                         <p>Work with your partner to discuss the following questions.</p>
                         <p>1.What is a sales letter like?</p>
@@ -1000,13 +2122,160 @@
                             <p>We can very well compete against 鈥� in price.</p>
                             <p>鈥� are the best-selling products of this kind.</p>
                         </div>
+                        <div class="resource-primary-border" style="padding: 8px; margin: 5% 0%">
+                            <div class="banshi openImgBox">
+                                <div class="swiper-container swiper_ppt">
+                                    <div class="swiper-wrapper">
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_01.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_02.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_03.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_04.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_05.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_06.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_07.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_08.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_09.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_10.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_11.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_12.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_13.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_14.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_15.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_16.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_17.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_18.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_19.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_20.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_21.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_22.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_23.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_24.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_25.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_26.png" />
+                                            </div>
+                                        </div>
+                                        <div class="swiper-slide">
+                                            <div class="imgBox" style="width: 100%; height: 100%">
+                                                <img src="../../assets/images/ppt/ppt_27.png" />
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="swiper-button-next"></div>
+                                    <div class="swiper-button-prev"></div>
+                                    <div class="pageBox"></div>
+                                </div>
+                                <!-- 鏄剧ず褰撳墠椤靛拰鎬婚〉鏁扮殑鍏冪礌 -->
+                            </div>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
                     <span class="contet-num-box">76</span>
                 </div>
             </div>
-        </div> -->
+        </div>
     </div>
 </template>
 <script>
@@ -1022,50 +2291,54 @@
     },
     data() {
         return {
-            imgThirteen: require("../../assets/images/grammar.jpg"),
-            showAnswerOne: false,
-            showAnswerTwo: false,
-            showAnswerThree: false,
-            showAnswerFour: false,
-            showAnswerFive: false,
+            imgThirteen: require("../../assets/images/grammar4-1.png"),
+            imgThirteenOne: require("../../assets/images/grammar4-2.png"),
             showImg: false,
-            showQuestionAnswer: false,
+            showImgOne: false,
             rawData: {
                 left: [
                     {
                         oldId: "FB34",
-                        txt: "Martin銆�銆�銆�銆�Silk",
+                        txt: "1. My phone",
                     },
                     {
                         oldId: "64D6",
-                        txt: "Jessica銆�銆�The Great Wall",
+                        txt: "2. We can pay for almost anything",
                     },
                     {
                         oldId: "2ED4",
-                        txt: "Soren銆�銆�Chinese Food",
+                        txt: "3. Now almost nobody uses",
                     },
                     {
                         oldId: "44DE",
-                        txt: "Chinese銆�銆�銆�銆�Tea",
+                        txt: "4. We rely on mobile phones",
                     },
+                    {
+                        oldId: "J20B",
+                        txt: "5. Mobile phones have changed",
+                    }
                 ],
                 right: [
                     {
-                        oldId: "64D6",
-                        txt: "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
-                    },
-                    {
-                        oldId: "FB34",
-                        txt: "It was first discovered and drank in China and my favorileLongjing tca is praduced near the West Lake in Hangzhou.",
-                    },
-                    {
                         oldId: "2ED4",
-                        txt: "The clothing material is quite popular among Roman women inancient times.",
+                        txt: "a.a fixed-line telephone.",
                     },
                     {
                         oldId: "44DE",
-                        txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
+                        txt: "b. all the time now.",
                     },
+                    {
+                        oldId: "64D6",
+                        txt: "c. online or by using an App on the phone.",
+                    },
+                    {
+                        oldId: "FB34",
+                        txt: "d. is almost dead.",
+                    },
+                    {
+                        oldId: "J20B",
+                        txt: "e. how we go about our everyday life.",
+                    }
                 ],
             },
             value: [],
@@ -1076,66 +2349,81 @@
                     {
                         id: "FB34",
                         linkValue:
-                            "The clothing material is quite popular among Roman women inancient times.",
-                        value: "Silk",
+                            "d. is almost dead.",
+                        value: "1. My phone",
                     },
                     {
                         id: "64D6",
                         linkValue:
-                            "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
-                        value: "The Great Wall",
+                            "c. online or by using an App on the phone.",
+                        value: "2. We can pay for almost anything",
                     },
                     {
                         id: "2ED4",
                         linkValue:
-                            "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
-                        value: "Chinese Food",
+                            "a. a fixed-line telephone.",
+                        value: "3. Now almost nobody uses",
                     },
                     {
                         id: "44DE",
                         linkValue:
-                            "It was first discovered and drank in China and my favorileLongjing tca is praduced near the West Lake in Hangzhou.",
-                        value: "Chinese Tea",
+                            "b. all the time now.",
+                        value: "4. We rely on mobile phones",
+                    },
+                    {
+                        id: "J20B",
+                        linkValue:
+                            "e. how we go about our everyday life.",
+                        value: "5. Mobile phones have changed",
                     },
                 ],
                 optionStyle: undefined,
                 id: 489306,
                 options: {
                     linkValues: [
+
                         {
-                            oldId: "64D6",
-                            txt: "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
+                            oldId: "2ED4",
+                            txt: "a.a fixed-line telephone.",
                         },
                         {
                             oldId: "44DE",
-                            txt: "It was first discovered and drank in China and my favoriteLongjing tea is produced near the West Lake in Hangzhou.",
+                            txt: "b. all the time now.",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "c. online or by using an App on the phone.",
                         },
                         {
                             oldId: "FB34",
-                            txt: "The clothing material is quite popular among Roman women inancient times.",
+                            txt: "d. is almost dead.",
                         },
                         {
-                            oldId: "2ED4",
-                            txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
-                        },
+                            oldId: "J20B",
+                            txt: "e. how we go about our everyday life.",
+                        }
                     ],
                     values: [
                         {
                             oldId: "FB34",
-                            txt: "Martin  Silk",
+                            txt: "1. My phone",
                         },
                         {
                             oldId: "64D6",
-                            txt: "The Great Wall",
+                            txt: "2. We can pay for almost anything",
                         },
                         {
                             oldId: "2ED4",
-                            txt: "Chinese Food",
+                            txt: "3. Now almost nobody uses",
                         },
                         {
                             oldId: "44DE",
-                            txt: "Chinese Tea",
+                            txt: "4. We rely on mobile phones",
                         },
+                        {
+                            oldId: "J20B",
+                            txt: "5. Mobile phones have changed",
+                        }
                     ],
                 },
                 questionType: "matching",
@@ -1146,7 +2434,7 @@
                 titleDescription: "1",
                 userChoise: [],
                 value: [],
-                answerImg: require("../../assets/images/matching-one.png"),
+                answerImg: require("../../assets/images/matching-four.png"),
             },
             questionData: {
                 warnUp: {
@@ -1194,7 +2482,7 @@
                     five: "",
                     six: "",
                     seven: "",
-                    enight: "",
+                    eight: "",
                     nine: "",
                 },
             },
@@ -1248,7 +2536,7 @@
                 readingTwo: "",
             },
             dropDownList: [
-                "animal rescue and care",
+                "robot floor cleaner",
                 "blood donation",
                 "community clean-ups",
                 "language service",
@@ -1275,6 +2563,131 @@
                     answer: "animal rescue and care",
                 },
             },
+            // 鏂板
+            warmUp:[
+                {
+                    type:'drapDown',
+                    isComplete:false,
+                    isShowAnswer:false,
+                    options:['robot floor cleaner','self-balancing scooter','camera drone','camera drone','camera drone','VR headset'],
+                    value:[
+                        {
+                            answer:'robot floor cleaner',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'camera drone',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'VR headset',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'fingerprint door lock',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'smartwatch',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'self-balancing scooter',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                    ]
+                },
+                {
+                    type:'fill',
+                    isComplete:false,
+                    isShowAnswer:false,
+                    value:[
+                        {
+                            answer:"2",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                        {
+                            answer:"4",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                        {
+                            answer:"1",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                        {
+                            answer:"3",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                        {
+                            answer:"6",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                        {
+                            answer:"5",
+                            userAnswer:'',
+                            isRight:null,
+                        },
+                    ]
+                }
+            ],
+            noSubmitData:[
+                {
+                    type:'shortAnswer',
+                    value:[
+                        {
+                            userAnswer:''
+                        },
+                        {
+                            userAnswer:''
+                        }
+                    ]
+                }
+            ],
+            readingOne:[
+                {
+                    type:'fill',
+                    isComplete:false,
+                    isShowAnswer:false,
+                    value:[
+                        {
+                            answer:'easier and safer',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'sea creatures',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'search-and-rescue',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'deliveries',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                        {
+                            answer:'emotions',
+                            userAnswer:'',
+                            isRight:null
+                        },
+                    ]
+                }
+            ]
         };
     },
     mounted() {
@@ -1290,6 +2703,12 @@
         if (dropdownData) {
             this.dropdownData = JSON.parse(dropdownData);
         }
+        const warmUp = localStorage.getItem('english-chapter04-warmup')
+        if(warmUp) this.warmUp = JSON.parse(warmUp)
+        const noSubmitData = localStorage.getItem('english-chapter04-noSubmitData')
+        if(noSubmitData) this.noSubmitData = JSON.parse(this.noSubmitData)
+        const readingOne = localStorage.getItem('english-chapter04-readingOne')
+        if(readingOne) this.readingOne = JSON.parse(readingOne)
         this.getPath();
     },
     methods: {
@@ -1367,7 +2786,10 @@
         showAnswer(type) {
             if (type == "showImg") {
                 this.showImg = !this.showImg;
+            } else if (type == "showImgOne") {
+                this.showImgOne = !this.showImgOne;
             }
+            setTimeout(() => { this.$emit("initViewer", "") }, 500)
         },
         handleQuestion(type) {
             if (type == "one") {
@@ -1429,12 +2851,47 @@
                 JSON.stringify(this.dropdownData)
             );
         },
-        saveData() {
-            console.log(this.testData);
+        // 鏂板
+        savewarmUp() {
+            localStorage.setItem('english-chapter04-warmup',JSON.stringify(this.warmUp))
         },
-        audioPlay() {
-            this.$emit("closeMiniAudio");
+        handlewarmUp() {
+            for (let index = 0; index < this.warmUp.length; index++) {
+                const item = this.warmUp[index];
+                item.isComplete = true
+                item.isShowAnswer = true
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.isRight = citem.userAnswer == citem.answer
+                }
+            }
+            this.savewarmUp()
         },
+        recastwarmUp() {
+            for (let index = 0; index < this.warmUp.length; index++) {
+                const item = this.warmUp[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.isRight = null
+                    citem.userAnswer = ''
+                }
+            }
+            localStorage.removeItem('english-chapter04-warmup')
+        },
+        viewwarmUp() {
+            for (let index = 0; index < this.warmUp.length; index++) {
+                const item = this.warmUp[index];
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        saveNoSubmitData() {
+            localStorage.setItem('english-chapter04-noSubmitData',JSON.stringify(this.noSubmitData))
+        },
+        saveReadingOne() {
+            localStorage.setItem('english-chapter04-readingOne',JSON.stringify(this.readingOne))
+        }
     },
 };
 </script>
@@ -1513,4 +2970,13 @@
     right: 0;
     background-color: red;
 }
+.dropdown-box-one {
+    
+    li {
+        width: 33%;
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-end;
+    }
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.1