From 467a032d491ea1cc35eabc09f0232d93a9f7a94f Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期二, 23 七月 2024 14:21:01 +0800
Subject: [PATCH] 英语点击单词卡方法优化

---
 src/books/English/view/components/chapter003.vue | 4910 +++++++++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 4,350 insertions(+), 560 deletions(-)

diff --git a/src/books/English/view/components/chapter003.vue b/src/books/English/view/components/chapter003.vue
index 140d12d..d4ba550 100644
--- a/src/books/English/view/components/chapter003.vue
+++ b/src/books/English/view/components/chapter003.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="chapter" num="4"> 
+    <div class="chapter" num="4">
         <!-- 绗笁鍗曞厓 -->
         <!-- 38 -->
         <div class="page-box" page="44">
@@ -10,7 +10,10 @@
                 <p class="img"></p>
                 <p><b>This unit will help you to:</b></p>
                 <p>鉃� Learn words and expressions about volunteering</p>
-                <p>鉃� Review the structure of the present continuous tense and the simple future tense</p>
+                <p>
+                    鉃� Review the structure of the present continuous tense and the simple
+                    future tense
+                </p>
                 <p>鉃� Ask for clarification politely</p>
                 <p>鉃� Be able to fill in the profile properly</p>
                 <p>鉃� Get ready to volunteer</p>
@@ -35,12 +38,19 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <h2 id="b009"><img class="img-0" alt="" src="../../assets/images/dy3-le1.jpg" /></h2>
+                        <h2 id="b009">
+                            <img class="img-0" alt="" src="../../assets/images/dy3-le1.jpg" />
+                        </h2>
                         <h3 id="c019"><span class="bjh3">Warm-up</span></h3>
-                        <p><b>鈪�.Put the expressions in the box below on the corresponding answer line under each
-                                picture.</b></p>
+                        <p>
+                            <b>鈪�.Put the expressions in the box below on the corresponding
+                                answer line under each picture.</b>
+                        </p>
                         <div class="bk-wh">
-                            <p>animal rescue and care銆�blood donation銆�community clean-ups銆�language service</p>
+                            <p>
+                                animal rescue and care銆�blood donation銆�community
+                                clean-ups銆�language service
+                            </p>
                         </div>
                         <div class="openImgBox">
                             <div class="fl ju-bt">
@@ -119,7 +129,6 @@
                                     </p>
                                 </div>
                             </div>
-
                             <div class="fl ju-bt">
                                 <div class="left" style="width: 48%">
                                     <div>
@@ -213,24 +222,75 @@
                                 </button>
                             </div>
                         </div>
-                        <p><b>鈪�.Talk to your partner about the types of volunteer work you know.</b></p>
-                        <h3 id="c020"><span class="bjh3">Listening</span></h3>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
-                        <p><b>Watch the video and mark the best answer to each question.</b></p>
-                        <div style="display: flex;">
-                            <div class="left" style="width: 55%; margin-top: 11%;">
-                                <p>1.Why do you want to be a volunteer?</p>
+                        <p>
+                            <b>鈪�.Talk to your partner about the types of volunteer work you
+                                know.</b>
+                            <span class="btn-box" @click="viewNoSubmitData(0, 0)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501"
+                                    viewBox="0 0 20.501 20.501">
+                                    <path class="a"
+                                        d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                                        transform="translate(-3327.144 15329)" />
+                                </svg>
+                            </span>
+                        </p>
+                        <textarea v-model="noSubmitData[0].value[0].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                            style="margin-left: 40px; width: 92%" class="fz-16 fm-son"
+                            @change="saveNoSubmitData"></textarea>
+                        <div class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%"
+                            v-if="noSubmitData[0].value[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <p>Going to the countryside to teach kids;</p>
+                            <p>Participating in community service;</p>
+                            <p>Taking care of the old in a nursing home;</p>
+                            <p>Membership in community associations;</p>
+                            <p>Census participation;</p>
+                            <p>Wildlife conservation;</p>
+                            <p>Environment protection;</p>
+                            <p>Community development;</p>
+                            <p>Arts and music NGO support.</p>
+                        </div>
+                        <h3 id="c020" 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>Watch the video and mark the best answer to each question.</b>
+                        </p>
+                        <div style="display: flex">
+                            <div class="left" style="width: 55%; margin-top: 11%">
+                                <p>1.{{ listenOne[0].stem }}</p>
                             </div>
-                            <div class="right" style="widtinputh: 45%;">
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> You can change lives.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> You can stay with friends.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> You can teach new skills.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> You can make more money.</p>
+                            <div class="right" style="width: 45%">
+                                <p v-for="(item, index) in listenOne[0].option" :key="index">
+                                    銆�<input type="radio" :value="item" name="volunteer" v-model="listenOne[0].value" />
+                                    {{ item }}
+                                    <span class="icon-box" v-if="listenOne[0].value == item">
+                                        <svg v-if="listenOne[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="listenOne[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>
+
                             </div>
+                        </div>
+                        <div class="event-header-text-bc pd-5" v-if="listenOne[0].isShowAnswer">
+                            绛旀:{{ listenOne[0].answer }}
                         </div>
                     </div>
                 </div>
@@ -255,63 +315,192 @@
                 <div class="padding-93">
                     <div class="bodystyle">
                         <div style="display: flex">
-                            <div class="left" style="width: 55%; margin-top: 11%;">
-                                <p>2.Who are more likely to be volunteers?</p>
+                            <div class="left" style="width: 55%; margin-top: 11%">
+                                <p>2.{{ listenOne[1].stem }}</p>
                             </div>
-                            <div class="right" style="width: 45%;">
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> College students.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> Nonprofessionals.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> People without jobs.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" /> Children.</p>
+                            <div class="right" style="width: 45%">
+                                <p v-for="(item, index) in listenOne[1].option" :key="index">
+                                    銆�<input type="radio" :value="item" name="likely" v-model="listenOne[1].value" />
+                                    {{ item }}
+                                    <span class="icon-box" v-if="listenOne[1].value == item">
+                                        <svg v-if="listenOne[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="listenOne[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>
                             </div>
+                        </div>
+                        <div class="event-header-text-bc pd-5" v-if="listenOne[1].isShowAnswer">
+                            绛旀:{{ listenOne[1].answer }}
                         </div>
                         <div style="display: flex">
-                            <div class="left" style="width: 50%; margin-top: 11%;">
-                                <p>3.Which activity is NOT mentioned in the video?</p>
+                            <div class="left" style="width: 50%; margin-top: 11%">
+                                <p>3.{{ listenOne[2].stem }}</p>
                             </div>
-                            <div class="right" style="width: 50%;">
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" />Volunteering in sport.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" />Emergency services.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" />Helping people with disabilities.</p>
-                                <p>銆�<input type="checkbox" name="ball" value="Language" id="1"
-                                        v-model="testData.check" />Teaching.</p>
+                            <div class="right" style="width: 50%">
+                                <p v-for="(item, index) in listenOne[2].option" :key="index">
+                                    銆�<input type="radio" :value="item" name="mentioned" v-model="listenOne[2].value" />
+                                    {{ item }}
+                                    <span class="icon-box" v-if="listenOne[2].value == item">
+                                        <svg v-if="listenOne[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="listenOne[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>
                             </div>
                         </div>
+                        <div class="event-header-text-bc pd-5" v-if="listenOne[2].isShowAnswer">
+                            绛旀:{{ listenOne[2].answer }}
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl ju-cn">
+                            <ul class="fl ju-ev w80">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handelListenOneData">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastListenOneData" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewListenOneData" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
                         <h3 id="c021"><span class="bjh3">Reading</span></h3>
-                        <p>1.As the saying goes,鈥淭he rose is in her hand,the flavor in mine.鈥� What鈥檚 your understanding
-                            of this saying?</p>
-                        <p>2.In what way do you help others in daily life?</p>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
-                        <p class="center"><b>Volunteering and Its Surprising Benefits</b></p>
-                        <p>With busy life,it can be hard to find time to volunteer.However,the benefits of volunteering
-                            can be enormous.</p>
-                        <p>One of the most well-known benefits of volunteering is the impact on the
-                            community.Volunteering allows you to connect to your community and make it a better
-                            place.Even helping out with the smallest tasks can make a real difference to the life of
-                            people in need.Volunteering can benefit you and your family as well as the people you choose
-                            to help.Doing volunteer work helps you make new friends,expand your network,and boost your
-                            social skills.</p>
-                        <p>Volunteering helps reduce the effects of stress,anger,and anxiety.The social contact aspect
-                            of helping and working with others can have a great effect on your overall mental
-                            health.Nothing reduces stress better than a meaningful connection to another person.Studies
-                            have found that those who volunteer have a lower mortality rate than those who do not.</p>
-                        <p>If you鈥檙e considering a new career,volunteering can help you get experience in your area of
-                            interest and meet people in the field.Even if you鈥檙e not planning to change
-                            careers,volunteering can give you the opportunity to practice important qualities and skills
-                            used in work,such as teamwork,communication skills and problem-solving skills.You might feel
-                            more comfortable stretching your wings at work once you鈥檝e developed these qualities and
-                            skills in a volunteer position first.</p>
-                    </div>
-                    <div>
+                        <p>
+                            1.As the saying goes,鈥淭he rose is in her hand,the flavor in mine.鈥�
+                            What鈥檚 your understanding of this saying?
+                            <span class="btn-box" @click="viewNoSubmitData(0, 1)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501"
+                                    viewBox="0 0 20.501 20.501">
+                                    <path class="a"
+                                        d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                                        transform="translate(-3327.144 15329)" />
+                                </svg>
+                            </span>
+                        </p>
+                        <textarea v-model="noSubmitData[0].value[1].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                            style="margin-left: 40px; width: 92%" class="fz-16 fm-son"
+                            @change="saveNoSubmitData"></textarea>
+                        <div class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%"
+                            v-if="noSubmitData[0].value[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <p>
+                                1銆両t means helping others is a virtue like the fragrance of
+                                rose.
+                            </p>
+                            <p>
+                                2銆乊ou share rose, you get fun or you benefit from your action.
+                            </p>
+                            <p>3銆乄e help others, we will feel happy.</p>
+                            <p>4銆� Helping others, warming yourself.</p>
+                        </div>
+                        <p>
+                            2.In what way do you help others in daily life?
+                            <span class="btn-box" @click="viewNoSubmitData(0, 2)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501"
+                                    viewBox="0 0 20.501 20.501">
+                                    <path class="a"
+                                        d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                                        transform="translate(-3327.144 15329)" />
+                                </svg>
+                            </span>
+                        </p>
+                        <textarea v-model="noSubmitData[0].value[2].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                            style="margin-left: 40px; width: 92%" class="fz-16 fm-son"
+                            @change="saveNoSubmitData"></textarea>
+                        <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%"
+                            v-if="noSubmitData[0].value[2].isShowAnswer">
+                            绛旀锛� share your experience of helping others briefly, such as:
+                            helping the classmates with their homework, working as a volunteer
+                            in an activity, giving a hand to someone with their heavy luggage,
+                        </p>
+                        <p class="center">
+                            <b>Volunteering and Its Surprising Benefits</b>
+                        </p>
+                        <p class="center">
+                            <audio :src="resource.readingOne" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio>
+                        </p>
+                        <p>
+                            With busy life,it can be hard to find time to
+                            volunteer.However,the benefits of volunteering can be
+                            <span class="word-bc" >enormous</span>
+                        </p>
+                        <p>
+                            One of the most well-known benefits of volunteering is the impact
+                            on the community.Volunteering allows you to connect to your
+                            community and make it a better place.Even helping out with the
+                            smallest tasks can make a real difference to the life of people in
+                            need.Volunteering can benefit you and your family as well as the
+                            people you choose to help.Doing volunteer work helps you make new
+                            friends,
+                            <span class="word-bc" >expand</span>
+                            your network,and
+                            <span class="word-bc" >boost</span>
+                            your social skills.
+                        </p>
+                        <p>
+                            Volunteering helps reduce the effects of stress,anger,and
+                            <span class="word-bc" >anxiety</span>
+                            .The social contact aspect of helping and working with
+                            others can have a great effect on your overall mental
+                            health.Nothing reduces stress better than a
+                            <span class="word-bc" >meaningful</span>
+                            connection
+                            to another person.Studies have found that those who volunteer have
+                            a lower
+                            <span class="word-bc" >mortality</span>
+                            rate than those who do not.
+                        </p>
+                        <p>
+                            If you鈥檙e considering a new career,volunteering can help you get
+                            experience in your area of interest and meet people in the
+                            field.Even if you鈥檙e not planning to change careers,volunteering
+                            can give you the opportunity to practice important qualities and
+                            skills used in work,such as teamwork,
+                            <span class="word-bc" >communication</span>
+                            skills and
+                            problem-solving skills.You might feel more comfortable stretching
+                            your wings at work once you鈥檝e developed these qualities and
+                            skills in a volunteer position first.
+                        </p>
                     </div>
                 </div>
+
+                <!-- 椤电爜  -->
                 <div class="preface-bottom">
                     <span class="contet-num-box">40</span>
                 </div>
@@ -332,38 +521,62 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>What鈥檚 more,volunteering is a fun and easy way to explore your interests and passions.Doing
-                            volunteer work can be a relaxing,energizing escape from your day-to-day routine of
-                            work,school,or family commitments.Volunteering also provides you with
-                            creativity,motivation,and vision that can carry over into your personal life and your
-                            career.</p>
-                        <p>In a word,volunteering has a great influence on your body and mental health.Remember when you
-                            help people,you help yourself as well.When you make plans for yourself,it is always a good
-                            idea to spare some time for volunteering service.Not only can volunteering improve your
-                            r茅sum茅,but it can also help connect you to more people and bring fulfillment to your life.
+                        <p>
+                            What鈥檚 more,volunteering is a fun and easy way to explore your
+                            interests and
+                            <span class="word-bc" >passions</span>
+                            .Doing volunteer work can be a
+                            relaxing,
+                            <span class="word-bc" >energizing</span>
+                            escape from your day-to-day routine of
+                            work,school,or family
+                            <span class="word-bc" >commitments</span>
+                            .Volunteering also provides you
+                            with <span class="word-bc" >creativity</span>
+                            ,motivation,and
+                            <span class="word-bc" >vision</span>
+                            that can carry over into
+                            your personal life and your career.
+                        </p>
+                        <p>
+                            In a word,volunteering has a great influence on your body and
+                            mental health.Remember when you help people,you help yourself as
+                            well.When you make plans for yourself,it is always a good idea to
+                            spare some time for volunteering service.Not only can volunteering
+                            improve your r茅sum茅,but it can also help connect you to more
+                            people and bring
+                            <span class="word-bc">fulfillment</span>
+                            to your life.
                         </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>
-                        <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
-                            @play="audioPlay"></audio>
+                        <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload"
+                            style="margin-left: 10px" class="audio"></audio>
                         <p>enormous /瑟藞n蓴藧m蓹s/ <i>adj.</i> 宸ㄥぇ鐨勶紱搴炲ぇ鐨�</p>
                         <div class="bkbj">
                             <p><i>extremely large</i></p>
                         </div>
                         <p>expand /瑟k藞sp忙nd/ <i>v.</i> 鎵╁ぇ锛屽鍔狅紙灏虹爜銆佹暟閲忔垨閲嶈鎬э級</p>
                         <div class="bkbj">
-                            <p><i>to become greater in size,number or importance; to make sth.greater in size,number or
-                                    importance</i></p>
+                            <p>
+                                <i>to become greater in size,number or importance; to make
+                                    sth.greater in size,number or importance</i>
+                            </p>
                         </div>
                         <p>boost /bu藧st/ <i>v.</i> 浣垮闀匡紱浣垮叴鏃�</p>
                         <div class="bkbj">
-                            <p><i>to make sth.increase,or become better or more successful</i></p>
+                            <p>
+                                <i>to make sth.increase,or become better or more successful</i>
+                            </p>
                         </div>
                         <p>anxiety /忙艐藞za瑟蓹ti/ <i>n.</i> 鐒﹁檻锛涘咖铏�</p>
                         <div class="bkbj">
-                            <p><i>the state of feeling nervous or worried that sth.bad is going to happen</i></p>
+                            <p>
+                                <i>the state of feeling nervous or worried that sth.bad is going
+                                    to happen</i>
+                            </p>
                         </div>
                         <p>meaningful /藞mi藧n瑟艐fl/ <i>adj.</i> 閲嶈鐨勶紱涓ヨ們鐨�</p>
                         <div class="bkbj">
@@ -371,18 +584,28 @@
                         </div>
                         <p>mortality /m蓴藧藞t忙l蓹ti/ <i>n.</i> 姝讳骸鐜囷紱姝讳骸鏁伴噺</p>
                         <div class="bkbj">
-                            <p><i>the number of deaths in a particular situation or period of time</i></p>
+                            <p>
+                                <i>the number of deaths in a particular situation or period of
+                                    time</i>
+                            </p>
                         </div>
                         <p>communication /k蓹藢mju藧n瑟藞ke瑟蕛n/ <i>n.</i> 琛ㄨ揪锛涗氦娴�</p>
                         <div class="bkbj">
-                            <p><i>the activity or process of expressing ideas and feelings or of giving people
-                                    information</i></p>
+                            <p>
+                                <i>the activity or process of expressing ideas and feelings or
+                                    of giving people information</i>
+                            </p>
                         </div>
                         <p>passion /藞p忙蕛n/ <i>n.</i> 婵�鎯咃紱 寮虹儓鎯呮劅</p>
                         <div class="bkbj">
-                            <p><i>a very strong feeling of love,hatred,anger,enthusiasm,etc.</i></p>
+                            <p>
+                                <i>a very strong feeling of love,hatred,anger,enthusiasm,etc.</i>
+                            </p>
                         </div>
-                        <p>energize /藞en蓹d蕭a瑟z/ <i>v.</i> 缁欙紙鏌愪汉锛� 澧炴坊鑳介噺锛堟垨绮惧姏銆佹椿鍔涖�佸共鍔诧級</p>
+                        <p>
+                            energize /藞en蓹d蕭a瑟z/ <i>v.</i> 缁欙紙鏌愪汉锛�
+                            澧炴坊鑳介噺锛堟垨绮惧姏銆佹椿鍔涖�佸共鍔诧級
+                        </p>
                         <div class="bkbj">
                             <p><i>to give sb.more energy,strength,etc.</i></p>
                         </div>
@@ -412,9 +635,12 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        p>creativity /藢kri藧e瑟藞t瑟v蓹ti/ <i>n.</i> 鍒涢�犲姏锛涘垱閫犳��</p>
+                        <p>creativity /藢kri藧e瑟藞t瑟v蓹ti/ <i>n.</i> 鍒涢�犲姏锛涘垱閫犳��</p>
                         <div class="bkbj">
-                            <p><i>the use of skill and imagination to produce sth.new or to produce art</i></p>
+                            <p>
+                                <i>the use of skill and imagination to produce sth.new or to
+                                    produce art</i>
+                            </p>
                         </div>
                         <p>vision /藞v瑟蕭n/ <i>n.</i> 瑙嗛噹</p>
                         <div class="bkbj">
@@ -422,41 +648,148 @@
                         </div>
                         <p>fulfillment /f蕣l藞f瑟lm蓹nt/ <i>n.</i> 瀹炵幇</p>
                         <div class="bkbj">
-                            <p><i>the act of doing or achieving what was hoped for or expected</i></p>
+                            <p>
+                                <i>the act of doing or achieving what was hoped for or
+                                    expected</i>
+                            </p>
                         </div>
-                        <div style="display: flex;">
-                            <div class="left" style="width: 45%;">
+                        <div style="display: flex">
+                            <div class="left" style="width: 45%; text-wrap: nowrap">
                                 <p>help out 甯姪瑙e喅闅鹃锛涙晳鍑�</p>
                                 <p>stretch one鈥檚 wings 澶у睍鎷宠剼</p>
+                                <p>carry over 锛堝湪涓嶅悓鎯呭喌涓嬶級 缁х画瀛樺湪锛屼繚鎸佷笅鍘�</p>
                             </div>
-                            <div class="right" style="width: 55%;">
+                            <div class="right" style="width: 55%">
                                 <p>make a difference 鏈夊奖鍝嶏紱鏈夊叧绯�</p>
                                 <p>what鈥檚 more 鑰屼笖锛涙澶�</p>
                             </div>
                         </div>
-                        <p>carry over 锛堝湪涓嶅悓鎯呭喌涓嬶級 缁х画瀛樺湪锛屼繚鎸佷笅鍘�</p>
                         <p></p>
                         <p><b>鈪�.Reading comprehension.</b></p>
-                        <p>A.Read through the passage and choose the main idea for Paragraph 2 to 5.</p>
-                        <p>1.Paragraph 2銆�銆�a.Volunteering can advance your career.</p>
-                        <p>2.Paragraph 3銆�銆�b.Volunteering brings fun and fulfillment to your life.</p>
-                        <p>3.Paragraph 4銆�銆�c.Volunteering is good for your mind.</p>
-                        <p>4.Paragraph 5銆�銆�d.Volunteering connects you to your community.</p>
-                        <p>B.Choose the best answer to each question according to the information from the passage.</p>
-                        <p>1.What might be the reason that people don鈥檛 volunteer?</p>
-                        <p>a.People are too busy to volunteer.</p>
-                        <p>b.People can鈥檛 find ways to volunteer.</p>
-                        <p>c.There is no benefit in volunteering.</p>
-                        <p>d.The volunteer work is too hard to do.</p>
-                        <p>2.Which of the following is NOT true?</p>
-                        <p>a.Volunteering is a win-win behavior for both parties.</p>
-                        <p>b.Small acts of helping others also matter.</p>
-                        <p>c.Those who volunteer enjoy a lower mortality rate.</p>
-                        <p>d.Volunteering has nothing to do with one鈥檚 mental health.</p>
-                        <p>3.In what way can volunteering help with one鈥檚 career development?</p>
-                        <p>a.Providing one with a new career.</p>
-                        <p>b.Helping to arouse one鈥檚 interests.</p>
-                        <p>c.Offering an opportunity to practice working skills.</p>
+                        <matching :rawData="rawData" :question="question"></matching>
+                        <p>
+                            B.Choose the best answer to each question according to the
+                            information from the passage.
+                        </p>
+                        <p>
+                            1.What might be the reason that people don鈥檛 volunteer?
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                        銆�
+                        <p>
+                            <input type="radio" value="a" name="toobusy" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[0].userAnswer" />
+                            a.People are too busy to volunteer.
+                        </p>
+                        <p>
+                            <input type="radio" value="b" name="toobusy" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[0].userAnswer" />
+                            b.People can鈥檛 find ways to volunteer.
+                        </p>
+                        <p>
+                            <input type="radio" value="c" name="toobusy" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[0].userAnswer" />
+                            c.There is no benefit in volunteering.
+                        </p>
+                        <p>
+                            <input type="radio" value="d" name="toobusy" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[0].userAnswer" />
+                            d.The volunteer work is too hard to do.
+                        </p>
+                        <p>
+                            2.Which of the following is NOT true?
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                        <p>
+                            <input type="radio" value="a" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[1].userAnswer" />
+                            a.Volunteering is a win-win behavior for both parties.
+                        </p>
+                        <p>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[1].userAnswer" />
+                            b.Small acts of helping others also matter.
+                        </p>
+                        <p>
+                            <input type="radio" value="c" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[1].userAnswer" />
+                            c.Those who volunteer enjoy a lower mortality rate.
+                        </p>
+                        <p>
+                            <input type="radio" value="d" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[1].userAnswer" />
+                            d.Volunteering has nothing to do with one鈥檚 mental health.
+                        </p>
+                        <p>
+                            3.In what way can volunteering help with one鈥檚 career development?
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                        <p>
+                            <input type="radio" value="a" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[2].userAnswer" />
+                            a.Providing one with a new career.
+                        </p>
+                        <p>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[2].userAnswer" />
+                            b.Helping to arouse one鈥檚 interests.
+                        </p>
+                        <p>
+                            <input type="radio" value="c" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[2].userAnswer" />
+                            c.Offering an opportunity to practice working skills.
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -479,37 +812,284 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>d.Bringing more comfort to those who are at work.</p>
-                        <p>4.What suggestion does the writer offer in the last paragraph?</p>
-                        <p>a.Making a plan before volunteering.</p>
-                        <p>b.Preparing a r茅sum茅 in advance.</p>
-                        <p>c.Taking a physical and mental health check.</p>
-                        <p>d.Spending some time volunteering.</p>
-                        <p>5.What is the author鈥檚 attitude towards volunteering?</p>
-                        <p>a.Indifferent. b.Supportive. c.Opposed.d.Unknown.</p>
-                        <p><b>鈪�.Language focus.</b></p>
-                        <p>A.Fill in the blanks with the proper words in the passage.The initial letters of the words
-                            have been given.</p>
-                        <p>There are e______benefits when it comes to volunteering.First,it helps to make the community
-                            a better place,and it also helps you to connect to people and b______your social
-                            skills.Second,volunteering helps to deal with stress,anger and a______.Studies show that
-                            people who volunteer have a lower m______rate.Third,volunteering helps with one鈥檚
-                            career.When you get the chance to practice working skills,you will feel more comfortable at
-                            work.Fourth,when you are tied up with the daily routine,volunteering can be an
-                            e______escape,where you can find your interests and p______.All in all,with all the
-                            benefits,it is always a good idea to spend some time volunteering.</p>
-                        <p>B.Underline the following expressions in the passage and make sentences with them.</p>
-                        <p>1.help out_________________________________________</p>
-                        <p>2.make a difference_________________________________</p>
-                        <p>3.stretch one鈥檚 wings________________________________</p>
-                        <p>4.what鈥檚 more_____________________________________</p>
-                        <p>5.carry over_______________________________________</p>
-                        <p>C.Translate the following sentences into Chinese.</p>
-                        <p>1.Joining the Youth Volunteer Association in college expands her friendship circle.</p>
-                        <p>_______________________________________________________</p>
-                        <p>2.Serving in the Beijing 2022 Winter Olympics was a meaningful and unforgettable experience.
+                        <p>
+                            <input type="radio" value="d" name="bothparties"
+                                v-model="wordsOne[0].value[2].userAnswer" />
+                            d.Bringing more comfort to those who are at work.
                         </p>
-                        <p>_______________________________________________________</p>
+                        <p>
+                            4.What suggestion does the writer offer in the last paragraph?
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                        <p>
+                            <input type="radio" value="a" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[3].userAnswer" />
+                            a.Making a plan before volunteering.
+                        </p>
+                        <p>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[3].userAnswer" />
+                            b.Preparing a r茅sum茅 in advance.
+                        </p>
+                        <p>
+                            <input type="radio" value="c" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[3].userAnswer" />
+                            c.Taking a physical and mental health check.
+                        </p>
+                        <p>
+                            <input type="radio" value="d" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[3].userAnswer" />
+                            d.Spending some time volunteering.
+                        </p>
+                        <p>
+                            5.What is the author鈥檚 attitude towards volunteering?
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                            <input type="radio" value="a" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[4].userAnswer" />
+                            a.Indifferent.
+                        </p>
+                        <p>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[4].userAnswer" />
+                            b.Supportive.
+                        </p>
+                        <P>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[4].userAnswer" />
+                            c.Opposed.
+                        </P>
+                        <P>
+                            <input type="radio" value="b" name="bothparties" :disabled="wordsOne[0].isComplete"
+                                v-model="wordsOne[0].value[4].userAnswer" />
+                            d.Unknown.
+                        </P>
+                        <p class="event-header-text-bc pd-5" style="width: 90%" v-if="wordsOne[0].isShowAnswer">
+                            绛旀锛�1.a 2.d 3.c 4.d 5.b
+                        </p>
+                        <p><b>鈪�.Language focus.</b></p>
+                        <p>
+                            A.Fill in the blanks with the proper words in the passage.The
+                            initial letters of the words have been given.
+                        </p>
+                        <p>
+                            There are e
+                            <input :disabled="wordsOne[1].isComplete" type="text" class="input-bottom-border"
+                                style="width: 60px" v-model="wordsOne[1].value[0].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>
+                            benefits when it comes to volunteering.First,it helps to make the
+                            community a better place,and it also helps you to connect to
+                            people and b<input :disabled="wordsOne[1].isComplete" type="text"
+                                class="input-bottom-border" style="width: 60px"
+                                v-model="wordsOne[1].value[1].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>your social skills.Second,volunteering helps to deal with
+                            stress,anger and a<input :disabled="wordsOne[1].isComplete" type="text"
+                                class="input-bottom-border" style="width: 60px"
+                                v-model="wordsOne[1].value[2].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>.Studies show that people who volunteer have a lower m<input
+                                :disabled="wordsOne[1].isComplete" type="text" class="input-bottom-border"
+                                style="width: 60px" v-model="wordsOne[1].value[3].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[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="wordsOne[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>rate.Third,volunteering helps with one鈥檚 career.When you get the
+                            chance to practice working skills,you will feel more comfortable
+                            at work.Fourth,when you are tied up with the daily
+                            routine,volunteering can be an e<input :disabled="wordsOne[1].isComplete" type="text"
+                                class="input-bottom-border" style="width: 60px"
+                                v-model="wordsOne[1].value[4].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[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="
+                                    wordsOne[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>escape,where you can find your interests and p<input
+                                :disabled="wordsOne[1].isComplete" type="text" class="input-bottom-border"
+                                style="width: 60px" v-model="wordsOne[1].value[5].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="
+                                    wordsOne[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="
+                                    wordsOne[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>.All in all,with all the benefits,it is always a good idea to
+                            spend some time volunteering.
+                        </p>
+                        <!-- 绛旀 -->
+                        <p class="event-header-text-bc pd-5" style="width: 90%" v-if="wordsOne[1].isComplete">
+                            绛旀锛�(1)enormous &nbsp; (2) boost &nbsp; (3) anxiety &nbsp; (4)
+                            mortality &nbsp; (5) energizing &nbsp; (6) passion
+                        </p>
+                        <p>
+                            B.Underline the following expressions in the passage and make
+                            sentences with them.
+                        </p>
+                        <p class="tl-lf" v-for="(item, index) in wordsOne[2].value " :key="index">
+                            {{ index + 1 }}.{{ item.stem }}
+                            <textarea v-model="item.userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                                :disabled="wordsOne[2].isComplete" style="margin-left: 40px; width: 92%"
+                                class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+                        </p>
+                        <!-- 渚嬪彞 -->
+                        <div class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%"
+                            v-if="wordsOne[2].isShowAnswer">
+                            <span>渚嬪彞锛�</span>
+                            <p>
+                                1銆両 helped out with the check-in of athletes at the sports
+                                game.
+                            </p>
+                            <p>
+                                2銆丯o matter how small the deed is, it will make a difference to
+                                people who are in need.
+                            </p>
+                            <p>
+                                3銆乊our experience of volunteering will help you to stretch your
+                                wings in your future career.
+                            </p>
+                            <p>
+                                4銆乂olunteering does good to one鈥檚 body; what鈥檚 more, it鈥檚 also
+                                good for one鈥檚 mental health.
+                            </p>
+                            <p>
+                                5銆乀he spirit of volunteering will be carried over from
+                                generation to generation.
+                            </p>
+                        </div>
+                        <p>C.Translate the following sentences into Chinese.</p>
+                        <p>
+                            1.Joining the Youth Volunteer Association in college expands her
+                            friendship circle.
+                        </p>
+                        <p>
+                            <input :disabled="wordsOne[3].isComplete" type="text" class="input-bottom-border"
+                                style="width: 470px" v-model="wordsOne[3].value[0].userAnswer" @change="setTestData" />
+                        </p>
+                        <p>
+                            2.Serving in the Beijing 2022 Winter Olympics was a meaningful and
+                            unforgettable experience.
+                        </p>
+                        <p>
+                            <input :disabled="wordsOne[3].isComplete" type="text" class="input-bottom-border"
+                                style="width: 470px" v-model="wordsOne[3].value[1].userAnswer" @change="setTestData" />
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -532,36 +1112,194 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>3.It is the commitment to children that keeps her a teacher in the village school for a life
-                            time.</p>
-                        <p>_______________________________________________________</p>
-                        <p>4.Volunteering in different programs helps him grow up to be a man of vision.</p>
-                        <p>_______________________________________________________</p>
-                        <p><b>鈪�.Grammar focus:The present continuous tense.</b></p>
-                        <p>A.Complete the sentences with the present continuous form of the verbs given in the brackets.
+                        <p>
+                            3.It is the commitment to children that keeps her a teacher in the
+                            village school for a life time.
                         </p>
-                        <p>1.Encouraged by other volunteers,he_________(consider) becoming a regular helper in community
-                            service.</p>
-                        <p>2.At the moment,I_________(plan) to work as a volunteer teacher after graduation.</p>
-                        <p>3.What you_________(do) at present will make a difference to people around you.</p>
-                        <p>4.Currently,they_________(put) a lot of efforts into volunteer work.</p>
-                        <p>5.The smile on her face says that she_________(have) a great time with the old in the nursing
-                            home.</p>
-                        <p>B.Describe each picture below in English using the present continuous tense according to the
-                            Chinese hints.</p>
+                        <p>
+                            <input :disabled="wordsOne[3].isComplete" type="text" class="input-bottom-border"
+                                style="width: 470px" v-model="wordsOne[3].value[2].userAnswer" @change="setTestData" />
+                        </p>
+                        <p>
+                            4.Volunteering in different programs helps him grow up to be a man
+                            of vision.
+                        </p>
+                        <p>
+                            <input :disabled="wordsOne[3].isComplete" type="text" class="input-bottom-border"
+                                style="width: 470px" v-model="wordsOne[3].value[3].userAnswer" @change="setTestData" />
+                        </p>
+                        <!-- 绛旀 -->
+                        <div class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%"
+                            v-if="wordsOne[3].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <p>1銆佸姞鍏ュ鏍¢噷鐨勯潚骞村織鎰胯�呭崗浼氭墿澶т簡濂圭殑鏈嬪弸鍦堛��</p>
+                            <p>2銆佹湇鍔�2022鐨勫寳浜啲濂ヤ細鏄竴娆¢潪甯告湁鎰忎箟涓旇浜洪毦蹇樼殑缁忓巻銆�</p>
+                            <p>3銆佸瀛╁瓙浠殑鎵胯璁╁ス鍦ㄨ繖鎵�涔℃潙灏忓鍋氫簡涓�杈堝瓙鐨勮�佸笀銆�</p>
+                            <p>4銆佸弬涓庝笉鍚岀殑蹇楁効鑰呴」鐩府鍔╀粬鎴愰暱涓轰簡涓�涓湁杩滆鐨勪汉銆�</p>
+                        </div>
+                        <p><b>鈪�.Grammar focus:The present continuous tense.</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.Complete the sentences with the present continuous form of the
+                            verbs given in the brackets.
+                        </p>
+                        <p>
+                            1.Encouraged by other volunteers,he<input :disabled="wordsOne[4].isComplete" type="text"
+                                class="input-bottom-border" style="width: 70px"
+                                v-model="wordsOne[4].value[0].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[4].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="
+                                    wordsOne[4].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>
+                            (consider) becoming a regular helper in community service.
+                        </p>
+                        <p>
+                            2.At the moment,I<input :disabled="wordsOne[4].isComplete" type="text"
+                                class="input-bottom-border" style="width: 70px"
+                                v-model="wordsOne[4].value[1].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[4].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="
+                                    wordsOne[4].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>
+                            (plan) to work as a volunteer teacher after graduation.
+                        </p>
+                        <p>
+                            3.What you<input :disabled="wordsOne[4].isComplete" type="text" class="input-bottom-border"
+                                style="width: 70px" v-model="wordsOne[4].value[2].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[4].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="
+                                    wordsOne[4].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>
+                            (do) at present will make a difference to people around you.
+                        </p>
+                        <p>
+                            4.Currently,they<input :disabled="wordsOne[4].isComplete" type="text"
+                                class="input-bottom-border" style="width: 70px"
+                                v-model="wordsOne[4].value[3].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[4].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="
+                                    wordsOne[4].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>
+                            (put) a lot of efforts into volunteer work.
+                        </p>
+                        <p>
+                            5.The smile on her face says that she<input :disabled="wordsOne[4].isComplete" type="text"
+                                class="input-bottom-border" style="width: 70px"
+                                v-model="wordsOne[4].value[4].userAnswer" @change="setTestData" />
+                            <span>
+                                <svg v-if="wordsOne[4].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="
+                                    wordsOne[4].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>
+                            (have) a great time with the old in the nursing home.
+                        </p>
+                        <!-- 绛旀 -->
+                        <p class="event-header-text-bc pd-5" style="width: 90%" v-if="wordsOne[4].isShowAnswer">
+                            绛旀锛�(1)is considering &nbsp; (2) am planning &nbsp; (3) are
+                            doing &nbsp; (4) are putting &nbsp; (5) is having
+                        </p>
+                        <p>
+                            B.Describe each picture below in English using the present
+                            continuous tense according to the Chinese hints.
+                        </p>
                         <div class="fieldset-2">
-                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0054-1.jpg" /></p>
+                            <p class="center">
+                                <img class="img-e" alt="" src="../../assets/images/0054-1.jpg" />
+                            </p>
                             <p>蹇楁効鑰呮鍦ㄨ緟瀵煎瀛愪滑鍋氬姛璇俱��</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
+                            <textarea v-model="wordsOne[5].value[0].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                                :disabled="wordsOne[5].isComplete" style="margin-left: 20px; width: 92%"
+                                class="fz-16 fm-son" @change="setBookQuestion"></textarea>
                         </div>
                         <div class="fieldset-2">
-                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0054-2.jpg" /></p>
+                            <p class="center">
+                                <img class="img-e" alt="" src="../../assets/images/0054-2.jpg" />
+                            </p>
                             <p>瀛︾敓浠鍦ㄥ府蹇欏仛鍐滄椿銆�</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
+                            <textarea v-model="wordsOne[5].value[1].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                                :disabled="wordsOne[5].isComplete" style="margin-left: 20px; width: 92%"
+                                class="fz-16 fm-son" @change="setBookQuestion"></textarea>
                         </div>
                     </div>
                 </div>
@@ -586,31 +1324,74 @@
                 <div class="padding-93">
                     <div class="bodystyle">
                         <div class="fieldset-2">
-                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0055-1.jpg" /></p>
+                            <p class="center">
+                                <img class="img-e" alt="" src="../../assets/images/0055-1.jpg" />
+                            </p>
                             <p>蹇楁効鑰呮鍦ㄦ矙婊╀笂娓呯悊鍨冨溇銆�</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
+                            <textarea v-model="wordsOne[5].value[2].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                                :disabled="wordsOne[5].isComplete" style="margin-left: 20px; width: 92%"
+                                class="fz-16 fm-son" @change="setBookQuestion"></textarea>
                         </div>
                         <div class="fieldset-2">
-                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0055-2.jpg" /></p>
+                            <p class="center">
+                                <img class="img-e" alt="" src="../../assets/images/0055-2.jpg" />
+                            </p>
                             <p>蹇楁効鑰呮鍦ㄨ繘琛岃。鐗╂崘璧犳椿鍔ㄣ��</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
-                            <p>_______________________________________________</p>
+                            <textarea v-model="wordsOne[5].value[3].userAnswer" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+                                :disabled="wordsOne[5].isComplete" style="margin-left: 20px; width: 92%"
+                                class="fz-16 fm-son" @change="setBookQuestion"></textarea>
+                        </div>
+                        <div class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%"
+                            v-if="wordsOne[3].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <p>1銆乀he volunteer is tutoring the children.</p>
+                            <p>2銆丼tudents are helping with farming.
+                            </p>
+                            <p>3銆丄 group of volunteers are cleaning up trashes on the beach.
+                            </p>
+                            <p>4銆乀he little girl is holding a donation box full of clothes.
+                            </p>
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handelwordsOne">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastwordsOne" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewwordsOne" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
                         </div>
                         <h3 id="c022"><span class="bjh3">Mini-project</span></h3>
-                        <p>We all have done some volunteer work in one way or another before.Take some time to recall
-                            that experience,and then:</p>
-                        <p>1.Interview your partner about his/her volunteering experiences by asking the following
-                            questions;</p>
+                        <p>
+                            We all have done some volunteer work in one way or another
+                            before.Take some time to recall that experience,and then:
+                        </p>
+                        <p>
+                            1.Interview your partner about his/her volunteering experiences by
+                            asking the following questions;
+                        </p>
                         <p>2.Finish the worksheet and report to the class.</p>
                         <div class="fieldset">
                             <p>Questions:1.What volunteer work have you done?</p>
                             <p>銆�銆�銆�銆�2.How did you feel when you were volunteering?</p>
-                            <p>銆�銆�銆�銆�3.What are the benefits that experience has brought you?</p>
+                            <p>
+                                銆�銆�銆�銆�3.What are the benefits that experience has brought you?
+                            </p>
                         </div>
-                        <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" /></p>
+                        <p class="left">
+                            <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+                        </p>
                         <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
                             <tr class="table-th-bc">
                                 <td class="tl-cn">The Volunteer Work</td>
@@ -618,27 +1399,30 @@
                                 <td class="tl-cn">The Benefits</td>
                             </tr>
                             <tr class="table-tr-bc">
-                                <td style="word-break: break-all;">Taking care of left-behind children during summer
-                                    vacation.</td>
-                                <td style="word-break: break-all;">I feel very proud of myself.The work is very
-                                    meaningful.</td>
-                                <td style="word-break: break-all;">It has taught me to be more patient. I have learned
-                                    to take care of others, and to be more considerate.</td>
+                                <td style="word-break: break-all">
+                                    Taking care of left-behind children during summer vacation.
+                                </td>
+                                <td style="word-break: break-all">
+                                    I feel very proud of myself.The work is very meaningful.
+                                </td>
+                                <td style="word-break: break-all">
+                                    It has taught me to be more patient. I have learned to take
+                                    care of others, and to be more considerate.
+                                </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
+                                    <textarea v-model="miniTable[0].value[0].userAnswer"
                                         class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                        @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[0].value[1].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.four"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[0].value[2].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea " @change="saveminiTable"></textarea>
                                 </td>
                             </tr>
                         </table>
@@ -672,81 +1456,252 @@
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[0].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
-                                <td style="width: 40%;">
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                <td style="width: 40%">
+                                    <textarea v-model="miniTable[1].value[1].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
-                                <td style="width: 40%;">
-                                    <textarea v-model="questionData.table.four"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                <td style="width: 40%">
+                                    <textarea v-model="miniTable[1].value[2].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.six"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[3].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.seven"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[4].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.enight"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[5].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[6].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[7].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.four"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[8].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.six"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[9].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.seven"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[10].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.enight"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="miniTable[1].value[11].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @change="saveminiTable"></textarea>
                                 </td>
                             </tr>
                         </table>
-                        <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" /></p>
+                        <p class="left">
+                            <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
+                        </p>
                         <div class="bk-wh">
-                            <p>blood donation銆�volunteer teacher銆�community service銆�nursing
-                                home銆�rewarding銆�challenging銆�demanding銆�interesting銆�overwhelming銆�moving銆�merciful銆�kind-hearted銆�appreciate銆�cherish銆�respect
+                            <p class="dl-box">
+                                <span class="word-bc mr-20 dl-span" > blood
+                                    donation</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >volunteer teacher</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >community service</span>
+                                <span class="word-bc mr-20 dl-span" >nursing
+                                    home</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >rewarding</span>
+                                <span class="word-bc mr-20 dl-span"
+                                   >challenging</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >demanding</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >interesting</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >overwhelming</span>
+                                <span class="word-bc mr-20 dl-span" >moving</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >merciful</span>
+                                <span class="word-bc mr-20 dl-span"
+                                    >kind-hearted</span>
+                                <span class="word-bc mr-20 dl-span"
+                                   >appreciate</span>
+                                <span class="word-bc mr-20 dl-span">cherish</span>
+                                <span class="word-bc mr-20 dl-span" >respect</span>
                             </p>
                         </div>
-                        <h2 id="b010"><img class="img-0" alt="" src="../../assets/images/dy3-le2.jpg" /></h2>
+                        <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="b010">
+                            <img class="img-0" alt="" src="../../assets/images/dy3-le2.jpg" />
+                        </h2>
                         <h3 id="c023"><span class="bjh3">Warm-up</span></h3>
-                        <p><b>There are some organizations committed to making the world a better place and making a
-                                difference in people's lives.Work with your partner to do research online and match the
-                                following organizations with their missions.</b></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0056-1.jpg" /></p>
+                        <p>
+                            <b>There are some organizations committed to making the world a
+                                better place and making a difference in people's lives.Work with
+                                your partner to do research online and match the following
+                                organizations with their missions.</b>
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -769,25 +1724,86 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0056-1.jpg" /></p>
+                        <p class="center">
+                            <img class="img-a" alt="" src="../../assets/images/0056-1.jpg" />
+                        </p>
                         <h3 id="c024"><span class="bjh3">Reading</span></h3>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
-                        <p>1.More and more organizations and individuals in China are working in public service.Can you
-                            name a few?</p>
-                        <p>2.What changes do they bring to China?</p>
+                        <p>
+                            1.More and more organizations and individuals in China are working
+                            in public service.Can you name a few?
+                            <span class="btn-box" @click="showNoSubmitAnswer(3,0)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                                <path class="a"
+                                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                                    transform="translate(-3327.144 15329)" />
+                                </svg>
+                            </span>
+                        </p>
+                        <textarea name="" id="" cols="30" rows="10" v-model="noSubmitData[3].value[0].userAnswer" class="w100" @input="saveNoSubmitData"></textarea>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="noSubmitData[3].value[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <P v-for="(item,index) in noSubmitData[3].value[0].answer">
+                                {{index + 1}}.{{item}}
+                            </p>
+                        </div>
+                        <p>
+                            2.What changes do they bring to China?
+                            <span class="btn-box" @click="showNoSubmitAnswer(3,1)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
+                                <path class="a"
+                                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
+                                    transform="translate(-3327.144 15329)" />
+                                </svg>
+                            </span>
+                        </p>
+                        <textarea name="" id="" cols="30" rows="10" v-model="noSubmitData[3].value[1].userAnswer" class="w100" @input="saveNoSubmitData"></textarea>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="noSubmitData[3].value[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <P v-for="(item,index) in noSubmitData[3].value[1].answer">
+                                {{index + 1}}.{{item}}
+                            </p>
+                        </div>
                         <p class="center"><b>How to Light Up the World</b></p>
-                        <p>锛圗xcerpted from the speech 鈥淟earning from a Barefoot Movement鈥濓級</p>
-                        <p>If you go all over the world to very remote villages,you will often find only very old people
-                            and very young people.The men have already left.So,we came up with the simple solution of
-                            training grandmothers.Grandmothers are compassionate,tolerant,willing to learn,and
-                            patient.All the qualities that you need are there.</p>
-                        <p>Barefoot College follows the lifestyle of Gandhi:Students eat,sleep,and work on the
-                            floor.They can stay for 20 years,or they can go home tomorrow.As of today,we鈥檝e trained 604
-                            women solar engineers from 1,083 villages in 63 countries.</p>
-                        <p>The engineers have solar-electrified 45,000 houses.Please remember that our students are
-                            primarily women who have never left their villages before.They hate the idea of leaving
-                            their families and getting on a plane.When they reach India,sometimes after 19 hours of
-                            travel,they </p>
+                        <p class="center">
+                            <audio :src="resource.readingThree" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio>
+                        </p>
+                        <p>
+                            锛圗xcerpted from the speech 鈥淟earning from a Barefoot Movement鈥濓級
+                        </p>
+                        <p>
+                            If you go all over the world to very
+                            <span class="word-bc" >remote</span>
+                            villages,you will
+                            often find only very old people and very young people.The men have
+                            already left.So,we came up with the simple
+                            <span class="word-bc" >solution</span>
+                            of training
+                            grandmothers.Grandmothers are
+                            <span class="word-bc" >compassionate</span>
+                            ,
+                            <span class="word-bc" >tolerant</span>
+                            ,willing to
+                            learn,and patient.All the qualities that you need are there.
+                        </p>
+                        <p>
+                            Barefoot College follows the lifestyle of Gandhi:Students
+                            eat,sleep,and work on the floor.They can stay for 20 years,or they
+                            can go home tomorrow.As of today,we鈥檝e trained 604 women
+                            <span class="word-bc" >solar</span>
+                            engineers from 1,083 villages in 63 countries.
+                        </p>
+                        <p>
+                            The engineers have solar-
+                            <span class="word-bc" >electrified</span>
+                            45,000 houses.Please remember
+                            that our students are
+                            <span class="word-bc" >primarily</span>
+                            women who have never left their
+                            villages before.They hate the idea of leaving their families and
+                            getting on a plane.When they reach India,sometimes after 19 hours
+                            of travel,they
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -810,47 +1826,77 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>are faced with strange food,strange people,and strange language.We do all the training in
-                            sign
-                            language.Yet in six months,they will know more about solar engineering than most university
-                            graduates.Some women face problems at home for attending Barefoot College.In most of these
-                            traditional societies,the husband says,鈥淚f you go for training,don鈥檛 come back to me.I will
-                            take
-                            another wife.鈥� Then the wife goes,and when she returns,she helps provide her village with
-                            solar
-                            electricity.And her husband says,鈥淧lease come back to me.鈥� But she says,鈥淣o,I鈥檓 fine.鈥�
-                            Because
-                            the respect she now has is enormous.</p>
-                        <p>We taught a woman from Afghanistan.It was the first time a grandmother had left her
-                            village.Afterwards,at a community gathering,she went to sit with the men,who said,鈥淲hat do
-                            you think you鈥檙e doing? You should be sitting with the women.鈥� And she said quietly,鈥淭oday I
-                            am not a woman; I am an engineer.I have every right to sit with you.鈥�</p>
-                        <p>I have a dream.I would like to provide the world鈥檚 47 least developed countries with Barefoot
-                            College鈥搕rained grandmothers,and together they could solar-electrify more than 100,000
-                            homes.I would like to reach a million people,and I hope you will be a part of this dream.
+                        <p>
+                            are faced with strange food,strange people,and strange language.We
+                            do all the training in sign language.Yet in six months,they will
+                            know more about solar engineering than most university
+                            graduates.Some women face problems at home for
+                            <span class="word-bc" >attend</span>
+                            ing Barefoot
+                            College.In most of these traditional societies,the husband
+                            says,鈥淚f you go for
+                            <span class="word-bc" >training</span>
+                            ,don鈥檛 come back to me.I will take
+                            another wife.鈥� Then the wife goes,and when she returns,she helps
+                            provide her village with solar electricity.And her husband
+                            says,鈥淧lease come back to me.鈥� But she says,鈥淣o,I鈥檓 fine.鈥� Because
+                            the respect she now has is enormous.
                         </p>
-                        <p>I鈥檒l end the passage with a quotation from Gandhi:鈥淔irst they ignore you,then they laugh at
-                            you,then they fight you,and then you win.鈥�</p>
+                        <p>
+                            We taught a woman from Afghanistan.It was the first time a
+                            grandmother had left her village.
+                            <span class="word-bc" >Afterwards</span>
+                            ,at a community
+                            gathering,she went to sit with the men,who said,鈥淲hat do you think
+                            you鈥檙e doing? You should be sitting with the women.鈥� And she said
+                            quietly,鈥淭oday I am not a woman; I am an engineer.I have every
+                            right to sit with you.鈥�
+                        </p>
+                        <p>
+                            I have a dream.I would like to provide the world鈥檚 47 least
+                            developed countries with Barefoot College鈥搕rained grandmothers,and
+                            together they could solar-electrify more than 100,000 homes.I
+                            would like to reach a million people,and I hope you will be a part
+                            of this dream.
+                        </p>
+                        <p>
+                            I鈥檒l end the passage with a
+                            <span class="word-bc" >quotation</span>
+                            from Gandhi:鈥淔irst they
+                            <span class="word-bc" >ignore</span>
+                            you,then they laugh at you,then they fight you,and then you
+                            win.鈥�
+                        </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>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
+                        <audio :src="resource.readingFour" controls controlslist="noplaybackrate nodownload"
+                            class="audio"></audio>
                         <p>remote /r瑟藞m蓹蕣t/ <i>adj.</i> 鍋忚繙鐨�</p>
                         <div class="bkbj">
                             <p><i>far away from places where other people live</i></p>
                         </div>
                         <p>solution /s蓹藞lu藧蕛n/ <i>n.</i> 瑙e喅鍔炴硶</p>
                         <div class="bkbj">
-                            <p><i>a way of solving a problem or dealing with a difficult situation</i></p>
+                            <p>
+                                <i>a way of solving a problem or dealing with a difficult
+                                    situation</i>
+                            </p>
                         </div>
                         <p>compassionate /k蓹m藞p忙蕛蓹n蓹t/ <i>adj.</i> 鏈夊悓鎯呭績鐨勶紱鎬滄偗鐨�</p>
                         <div class="bkbj">
-                            <p><i>feeling or showing sympathy for people or animals who are suffering</i></p>
+                            <p>
+                                <i>feeling or showing sympathy for people or animals who are
+                                    suffering</i>
+                            </p>
                         </div>
                         <p>tolerant /藞t蓲l蓹r蓹nt/ <i>adj.</i> 瀹藉鐨勶紱瀹瑰繊鐨�</p>
                         <div class="bkbj">
-                            <p><i>able to accept what other people say or do even if you do not agree with it</i></p>
+                            <p>
+                                <i>able to accept what other people say or do even if you do not
+                                    agree with it</i>
+                            </p>
                         </div>
                         <p>solar /藞s蓹蕣l蓹(r)/ <i>adj.</i> 澶槼鑳界殑</p>
                         <div class="bkbj">
@@ -858,7 +1904,10 @@
                         </div>
                         <p>electrify /瑟藞lektr瑟fa瑟/ <i>v.</i> 浣跨數姘斿寲锛涚粰锛堟煇鐗╋級鍏呯數</p>
                         <div class="bkbj">
-                            <p><i>to convert to the use of electric power; to charge (sth.) with electricity</i></p>
+                            <p>
+                                <i>to convert to the use of electric power; to charge (sth.)
+                                    with electricity</i>
+                            </p>
                         </div>
                         <p>primarily /pra瑟藞mer蓹li/ <i>adv.</i> 涓昏鍦�</p>
                         <div class="bkbj">
@@ -892,42 +1941,213 @@
                         </div>
                         <p>traditional /tr蓹藞d瑟蕛蓹nl/ <i>adj.</i> 浼犵粺鐨�</p>
                         <div class="bkbj">
-                            <p><i>being part of the beliefs,customs or way of life of a particular group of people,which
-                                    have not changed for a long time</i></p>
+                            <p>
+                                <i>being part of the beliefs,customs or way of life of a
+                                    particular group of people,which have not changed for a long
+                                    time</i>
+                            </p>
                         </div>
                         <p>afterwards /藞蓱藧ft蓹w蓹dz/ <i>adv.</i> 鍚庢潵锛涗互鍚�</p>
                         <div class="bkbj">
-                            <p><i>at a later time; after an event that has already been mentioned</i></p>
+                            <p>
+                                <i>at a later time; after an event that has already been
+                                    mentioned</i>
+                            </p>
                         </div>
                         <p>quotation /kw蓹蕣藞te瑟蕛n/ <i>n.</i> 寮曡锛涘紩鏂囷紱璇綍</p>
                         <div class="bkbj">
-                            <p><i>a group of words or a short piece of writing taken from a book,play,speech,etc.and
-                                    repeated because it is interesting or useful</i></p>
+                            <p>
+                                <i>a group of words or a short piece of writing taken from a
+                                    book,play,speech,etc.and repeated because it is interesting or
+                                    useful</i>
+                            </p>
                         </div>
                         <p>ignore /瑟伞藞n蓴藧(r)/ <i>v</i>.浣鏈锛涗笉浜堢悊鐫�</p>
                         <div class="bkbj">
-                            <p><i>to pretend that you have not seen sb.or that sb.is not there</i></p>
+                            <p>
+                                <i>to pretend that you have not seen sb.or that sb.is not
+                                    there</i>
+                            </p>
                         </div>
-                        <div style="display: flex;">
-                            <div class="left" style="width:40%;">
+                        <div style="display: flex">
+                            <div class="left" style="width: 40%">
                                 <p>light up 鐐逛寒</p>
                                 <p>come up with 鎻愬嚭锛涙兂鍑�</p>
                                 <p>end ...with ...浠モ�︹�︾粨鏉熲�︹��</p>
                             </div>
-                            <div class="right" style="width:60%;">
+                            <div class="right" style="width: 60%">
                                 <p>go over (to ...) 浠庝竴澶勫埌锛堝彟涓�澶勶級</p>
                                 <p>be faced with sth.闈复锛屽繀椤诲浠橈紙鏌愭儏鍐碉級</p>
                             </div>
                         </div>
                         <div class="bj-note">
                             <p><b>Notes:</b></p>
-                            <p>Barefoot
+                            <p>
+                                Barefoot
                                 College锛氳丹鑴氬ぇ瀛︺�傝繖涓叕鐩婇」鐩富瑕侀拡瀵规潵鑷笘鐣屽悇鍦板啘鏉戠殑鏂囩洸鎴栧崐鏂囩洸锛屽ぇ閮ㄥ垎閮芥槸涓勾姣嶄翰鎴栫姣嶏紝涓哄ス浠彁渚涘厤璐圭殑鏁欒偛锛岃濂逛滑鎴愪负姘村姟宸ョ▼甯堛�佸お闃宠兘宸ョ▼甯堛�佽璁″笀銆佸姪浜у+銆佸缓绛戝笀鎴栧啘鏉戠ぞ浼氫紒涓氬銆�
                             </p>
                         </div>
                         <p><b>鈪�.Reading comprehension.</b></p>
                         <p>A.Fill in the blanks with the numbers in the passage.</p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0059-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 table-th-bc">1. So far, what has BarefootCollege achieved?</td>
+                                <td style="width: 65%;">
+                                    <p class="table-p"> It has trained l.
+                                        <input :disabled="listenTwo[0].isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[0].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        women solar engineers.
+                                    </p>
+                                    <p class="table-p">The women solar engineers are from 2.<input
+                                            :disabled="listenTwo[0].isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[1].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        villages in 3.<input :disabled="listenTwo[0].isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[2].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        countries.
+                                    </p>
+                                    <p class="table-p">The engineers have solar-electrifed 4.<input
+                                            :disabled="listenTwo[0].isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[3].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        homes.
+                                    </p>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td class="tl-cn table-th-bc">2.What's the author'sfuture goal?</td>
+                                <td style="width: 65%;">
+                                    <p class="table-p">He would like to provide the world's 5.<input
+                                            :disabled="listenTwo[0].isComplete" type="text"
+                                            class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[4].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        least developed countries
+                                        with engineers.
+                                    </p>
+                                    <p class="table-p">He wants to reach 6.<input :disabled="listenTwo[0].isComplete"
+                                            type="text" class="input-bottom-border input-bc-t" style="width: 70px"
+                                            v-model="listenTwo[0].value[5].userAnswer" @input="saveListenTwo" />
+                                        <span class="icon-box" v-if="listenTwo[0].isComplete">
+                                            <svg v-if="listenTwo[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="listenTwo[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>
+                                        people.
+                                    </p>
+                                </td>
+                            </tr>
+                        </table>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenTwo[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in listenTwo[0].value" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ item.answer }}
+                            </span>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -950,37 +2170,251 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>B.Decide whether the following statements are true (T) or false (F).</p>
-                        <p>(銆�) 1.Showing compassion and being patient are qualities needed for training.</p>
-                        <p>(銆�) 2.Women have to overcome a lot of difficulties to attend Barefoot College.</p>
-                        <p>(銆�) 3.Half of the courses in the training are done in sign language.</p>
-                        <p>(銆�) 4.Husbands are always supportive for wives to go for training.</p>
-                        <p>(銆�) 5.The training helps women gain respect for the changes they brought in.</p>
-                        <p><b>鈪�.Language focus.</b></p>
-                        <p>A.Replace the words in italics with the exact words in the passage and change the form if
-                            necessary.</p>
-                        <p>1.In <i>far-away </i>areas,only the old and the kids are left._____</p>
-                        <p>2.The government works on <i>ways</i> to fight against poverty._____</p>
-                        <p>3.People having no access to electricity <i>mainly</i> live in Africa._____</p>
-                        <p>4.Some college students choose to <i>join</i> volunteering programs after graduation._____
+                        <p>
+                            B.Decide whether the following statements are true (T) or false
+                            (F).
                         </p>
-                        <p>5.Family reunion is a <i>usual </i>way to celebrate the Spring Festival._____</p>
-                        <p>B.Fill in the blanks with the proper form of the expressions given below._____</p>
-                        <div class="fieldset">
-                            <p>end ...with ...銆�come up with銆�light up銆�be faced with銆�go over to</p>
+                        <p v-for="(item, index) in listenTwo[1].value" :key="index" class="fl al-cn">
+                            <span>
+                                (
+                                <select class="select-border" v-model="listenTwo[1].value[index].userAnswer"
+                                    @change="saveListenTwo" :disabled="listenTwo[1].isComplete">
+                                    <option v-for="(citem, cindex) in listenTwo[1].option" :key="cindex" :value="citem">
+                                        {{ citem }}
+                                    </option>
+                                </select>)
+                            </span>
+                            <span class="t0">{{ index + 1 }}.{{ item.stem }}</span>
+                            <span class="icon-box" v-if="listenTwo[1].isComplete">
+                                <svg v-if="item.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="item.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>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenTwo[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in listenTwo[1].value" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ item.answer }}
+                            </span>
                         </div>
-                        <p>1.After watching the news,he ________ the idea to support the little girl鈥檚 education.</p>
-                        <p>2.Many Irish people ________ America during the famine 锛堥ゥ鑽掓椂鏈燂級.</p>
-                        <p>3.They ________ the play ________ a song.</p>
-                        <p>4.The teacher鈥檚 smiles ________ the boy鈥檚 life.</p>
-                        <p>5.Girls in some parts of the world ________ gender discrimination.</p>
-                        <p><b>鈪�.Grammar focus:The simple future tense.</b></p>
+                        <p><b>鈪�.Language focus.</b></p>
+                        <p>
+                            A.Replace the words in italics with the exact words in the passage
+                            and change the form if necessary.
+                        </p>
+                        <p v-for="(item, index) in listenTwo[2].value" :key="index + 'listenTwo'" class="fl fw-wr">
+                            <span>{{ index + 1 }}.{{ item.stem }}</span>
+                            <input type="text" :disabled="listenTwo[2].isComplete" v-model="item.userAnswer"
+                                class="input-bottom-border input-bc-t" @input="saveListenTwo" style="width:80px">
+                            <span class="icon-box" v-if="listenTwo[2].isComplete">
+                                <svg v-if="item.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="item.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>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenTwo[2].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in listenTwo[2].value" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ item.answer }}
+                            </span>
+                        </div>
+                        <p>
+                            B.Fill in the blanks with the proper form of the expressions given
+                            below.
+                        </p>
+                        <div class="fieldset">
+                            <p>
+                                end ...with ...銆�come up with銆�light up銆�be faced with銆�go over
+                                to
+                            </p>
+                        </div>
+                        <p>
+                            1.After watching the news,he
+                            <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[0].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px">
+                            the idea to support the
+                            little girl鈥檚 education.
+                            <span class="icon-box" v-if="listenTwo[3].isComplete">
+                                <svg v-if="listenTwo[3].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="listenTwo[3].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>
+                        <p>
+                            2.Many Irish people
+                            <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[1].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px">
+                            America during the famine
+                            锛堥ゥ鑽掓椂鏈燂級.
+                            <span class="icon-box" v-if="listenTwo[3].isComplete">
+                                <svg v-if="listenTwo[3].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="listenTwo[3].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>
+                        <p>3.They <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[2].userAnswer[0]" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px">
+                            the play <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[2].userAnswer[1]" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px"> a song.
+                            <span class="icon-box" v-if="listenTwo[3].isComplete">
+                                <svg v-if="listenTwo[3].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="listenTwo[3].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>
+                        <p>4.The teacher鈥檚 smiles
+                            <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[3].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px">
+                            the boy鈥檚 life.
+                            <span class="icon-box" v-if="listenTwo[3].isComplete">
+                                <svg v-if="listenTwo[3].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="listenTwo[3].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>
+                        <p>
+                            5.Girls in some parts of the world
+                            <input type="text" :disabled="listenTwo[3].isComplete"
+                                v-model="listenTwo[3].value[4].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenTwo" style="width:80px">
+                            gender discrimination.
+                            <span class="icon-box" v-if="listenTwo[3].isComplete">
+                                <svg v-if="listenTwo[3].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="listenTwo[3].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>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenTwo[3].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in listenTwo[3].value" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ arrayToString(item.answer) }}
+                            </span>
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handelListenTwo">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastListenTwo" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewListenTwo" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
+                        <p><b>鈪�.Grammar focus:The simple future tense.</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>Underline the parts indicating the future tense.</p>
                         <p>1.I am about to send you an email with all of our prices.</p>
                         <p>2.She is to marry John next month.</p>
                         <p>3.I will call you as soon as I arrive there.</p>
                         <p>4.We are going to volunteer in the nursing home this weekend.</p>
-                        <p>5.My plane is taking off at 8:20,so I must be at the airport by 7:20.</p>
+                        <p>
+                            5.My plane is taking off at 8:20,so I must be at the airport by
+                            7:20.
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1003,80 +2437,275 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <h3 id="c025"><span class="bjh3">Mini-project</span></h3>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
-                        <p>Watch the video and mark what the man has done.Then discuss with your partner about what we
-                            can do in reality to make a change in people鈥檚 lives.</p>
+                        <h3 id="c025" class="fl al-cn">
+                            <span class="bjh3">Mini-project</span>
+                            <audio :src="resource.listenTwo" controls controlslist="noplaybackrate nodownload"
+                                class="audio"></audio>
+                        </h3>
+                        <p>
+                            Watch the video and mark what the man has done.Then discuss with
+                            your partner about what we can do in reality to make a change in
+                            people鈥檚 lives.
+                        </p>
                         <p>Things the man has done:</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Hold
-                            the elevator for the lady</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Catch
-                            the balloon for the kid</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Stop
-                            the shopping cart</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Teach
-                            kids to swim</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Help
-                            the old cross the street</p>
-                        <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" /> Plant
-                            trees in the park</p>
-                        <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" /></p>
+                        <p v-for="(item, index) in miniProjectTwo[0].option" :key="index">
+                            <input type="checkbox" name="Hold" :value="item" :disabled="miniProjectTwo[0].isComplete"
+                                v-model="miniProjectTwo[0].value[0].userAnswer" @change="saveMiniProjectTwo" />
+                            {{ item }}
+                            <span class="icon-box" v-if="miniProjectTwo[0].isComplete">
+                                <svg v-if="isShowRight(miniProjectTwo[0].value[0].answer, miniProjectTwo[0].value[0].userAnswer, item)"
+                                    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="isShowRight(miniProjectTwo[0].value[0].answer, miniProjectTwo[0].value[0].userAnswer, item) == 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>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="miniProjectTwo[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in miniProjectTwo[0].value[0].answer" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ arrayToString(item) }}
+                            </span>
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handelMiniProjectTwo">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastMiniProjectTwo" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewMiniProjectTwo" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
+                        <p class="left">
+                            <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+                        </p>
                         <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
                             <tr class="table-th-bc">
                                 <td class="tl-cn">Things We Can Do</td>
                                 <td class="tl-cn">Changes We Can Make</td>
                             </tr>
                             <tr class="table-tr-bc">
-                                <td style="word-break: break-all;">Hold the door for the personbehind me.</td>
-                                <td style="word-break: break-all;">It can be very embarrassing if one gets bumped by a
-                                    door, Holding the door for the person behind me shows that I care for other people.
+                                <td style="word-break: break-all">
+                                    Hold the door for the personbehind me.
+                                </td>
+                                <td style="word-break: break-all">
+                                    It can be very embarrassing if one gets bumped by a door,
+                                    Holding the door for the person behind me shows that I care
+                                    for other people.
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[0].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea "
+                                        @change="saveNoSubmitData"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[1].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitData"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[2].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea "
+                                        @input="saveNoSubmitData"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[3].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitData"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[4].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea "
+                                        @input="saveNoSubmitData"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[5].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitData"></textarea>
                                 </td>
                             </tr>
                             <tr class="table-tr-bc">
                                 <td>
-                                    <textarea v-model="questionData.table.two"
-                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
-                                        @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[6].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitData"></textarea>
                                 </td>
                                 <td>
-                                    <textarea v-model="questionData.table.three"
-                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
+                                    <textarea v-model="noSubmitData[1].value[7].userAnswer"
+                                        class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitData"></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>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1099,26 +2728,342 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <h2 id="b011"><img class="img-0" alt="" src="../../assets/images/dy3-le3.jpg" /></h2>
-                        <h3 id="c026"><span class="bjh3">Listening</span></h3>
-                        <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
-                        <p><b>鈪�.Listen to the recording and fill in the blanks with what you hear.</b></p>
-                        <p>Just now,I was giving people_________in Chinese.I am a_________here in Lotus Lane in
-                            Houhai.I鈥檝e lived in Beijing for 24 years and I鈥檓_________from the United States.My name is
-                            Terry.I鈥檓 64 years old and I鈥檓_________.And I_________some of my time
-                            volunteering,helping_________find their way around this beautiful area of Xicheng District
-                            in Beijing.I love volunteering because I love doing things for people.I like to make people
-                            happy.I think by making people happy they make other people happy.It鈥檚 like_________a stone
-                            into the river.It makes little waves and your_________can be given to other people.</p>
-                        <p><b>鈪�.Listen to the interview and answer the following questions.</b></p>
-                        <p>1.When did Mr.Crossman start volunteering?</p>
-                        <p>_________________________________________________________</p>
-                        <p>2.Why was volunteering not easy in the beginning?</p>
-                        <p>_________________________________________________________</p>
-                        <p>3.What makes him popular?</p>
-                        <p>_________________________________________________________</p>
-                        <p>4.What鈥檚 his understanding of the volunteering spirit?</p>
-                        <p>_________________________________________________________</p>
+                        <h2 id="b011">
+                            <img class="img-0" alt="" src="../../assets/images/dy3-le3.jpg" />
+                        </h2>
+                        <h3 id="c026" class="fl al-cn">
+                            <span class="bjh3">Listening</span>
+                            <!--controlslist="noplaybackrate nodownload"鍚庨潰鐨勯煶棰戞鍔犲叆杩欎釜-->
+                        </h3>
+                        <p>
+                        <b>鈪�.Listen to the recording and fill in the blanks with what you
+                                hear.</b>
+                        </p>
+                        <audio :src="resource.listenThree" controls controlslist="noplaybackrate nodownload"
+                        class="audio"></audio>
+                        <p>
+                            Just now,I was giving people
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[0].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            in Chinese.I am a
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[1].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            here in Lotus Lane in Houhai.I鈥檝e lived in Beijing for
+                            24 years and I鈥檓
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[2].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            from the United States.My name is
+                            Terry.I鈥檓 64 years old and I鈥檓
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[3].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            .And I
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[4].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            some of my
+                            time volunteering,helping
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[5].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                            find their way around this
+                            beautiful area of Xicheng District in Beijing.I love volunteering
+                            because I love doing things for people.I like to make people
+                            happy.I think by making people happy they make other people
+                            happy.It鈥檚 like
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[6].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[0].value[6].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="listenThree[0].value[6].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 stone into the river.It makes little
+                            waves and your
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[0].value[7].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree" style="width:80px">
+                            <span class="icon-box" v-if="listenThree[0].isComplete">
+                                <svg v-if="listenThree[0].value[7].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="listenThree[0].value[7].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>
+                            can be given to other people.
+                        </p>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenThree[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span v-for="(item, index) in listenThree[0].value" :key="index" class="mr-20">
+                                {{ index + 1 }}.{{ arrayToString(item.answer) }}
+                            </span>
+                        </div>
+                        <p>
+                            <b>鈪�.Listen to the interview and answer the following
+                                questions.</b>
+                        </p>
+                        <audio :src="resource.listenFour" controls controlslist="noplaybackrate nodownload"
+                        class="audio"></audio>
+                        <p>
+                            1.When did Mr.Crossman start volunteering?
+                            <span class="icon-box" v-if="listenThree[1].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                        </p>
+                        <p>
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[1].value[0].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree">
+                        </p>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenThree[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20">
+                                {{ listenThree[1].value[0].answer }}
+                            </span>
+                        </div>
+                        <p>
+                            2.Why was volunteering not easy in the beginning?
+                            <span class="icon-box" v-if="listenThree[1].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                        </p>
+                        <p>
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[1].value[1].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree">
+                        </p>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenThree[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20">
+                                {{ listenThree[1].value[1].answer }}
+                            </span>
+                        </div>
+                        <p>
+                            3.What makes him popular?
+                            <span class="icon-box" v-if="listenThree[1].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                        </p>
+                        <p>
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[1].value[2].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree">
+                        </p>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenThree[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20">
+                                {{ listenThree[1].value[2].answer }}
+                            </span>
+                        </div>
+                        <p>
+                            4.What鈥檚 his understanding of the volunteering spirit?
+                            <span class="icon-box" v-if="listenThree[1].isComplete">
+                                <svg v-if="listenThree[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="listenThree[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>
+                        </p>
+                        <p>
+                            <input type="text" :disabled="listenThree[0].isComplete"
+                                v-model="listenThree[1].value[3].userAnswer" class="input-bottom-border input-bc-t"
+                                @input="saveListenThree">
+                        </p>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="listenThree[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20">
+                                {{ listenThree[1].value[3].answer }}
+                            </span>
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handelListenThree">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastListenThree" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewListenThree" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1142,12 +3087,174 @@
                 <div class="padding-93">
                     <div class="bodystyle">
                         <h3 id="c027"><span class="bjh3">Practical Writing</span></h3>
-                        <p>For volunteer work,it usually starts with creating a volunteer profile.Whether you鈥檙e just
-                            starting out or a seasoned volunteer,you can save your volunteering preferences and capture
-                            your volunteering experiences in your volunteer profile.</p>
-                        <p><b>鈪�.Look at the following sample and discuss with your partner what are usually included in
-                                a volunteer profile.Mark the items listed in the box.</b></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0063-1.jpg" /></p>
+                        <p>
+                            For volunteer work,it usually starts with creating a volunteer
+                            profile.Whether you鈥檙e just starting out or a seasoned
+                            volunteer,you can save your volunteering preferences and capture
+                            your volunteering experiences in your volunteer profile.
+                        </p>
+                        <p>
+                            <b>鈪�.Look at the following sample and discuss with your partner
+                                what are usually included in a volunteer profile.Mark the items
+                                listed in the box.</b>
+                        </p>
+                        <p class="center" style="position: relative;">
+                            <img class="img-a" alt="" src="../../assets/images/0063-1.jpg" />
+                            <input type="checkbox" style="position: absolute;top:32%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Personal information"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:32%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Personal information')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Personal information') == 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>
+                            <input type="checkbox" style="position: absolute;top:36%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Education background"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:36%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Education background')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Education background') == 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>
+                            <input type="checkbox" style="position: absolute;top:39.5%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Volunteering experience"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:39.5%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Volunteering experience')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Volunteering experience') == 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>
+                            <input type="checkbox" style="position: absolute;top:43%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Professional experience"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:43%;right:2%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Professional experience')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Professional experience') == 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>
+                            <input type="checkbox" style="position: absolute; top:47%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Skills and qualifications"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:47%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Skills and qualifications')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Skills and qualifications') == 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>
+                            <input type="checkbox" style="position: absolute; top:50.5%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="Interests"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:50.5%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Interests')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'Interests') == 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>
+                            <input type="checkbox" style="position: absolute; top:54.5%;right:28%"
+                                v-model="practicalWriting[2].value[0].userAnswer" value="References"
+                                @change="savePracticalWriting" />
+                            <span class="icon-box" v-if="practicalWriting[2].isComplete"
+                                style="position: absolute;top:54.5%;right:4%">
+                                <svg v-if="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'References')"
+                                    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="isShowRight(practicalWriting[2].value[0].answer, practicalWriting[2].value[0].userAnswer, 'References') == 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>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1170,38 +3277,49 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p><b>鈪�.Match the following descriptions with their corresponding Chinese.</b></p>
+                        <p>
+                            <b>鈪�.Match the following descriptions with their corresponding
+                                Chinese.</b>
+                        </p>
                         <p><b>1.gender</b></p>
-                        <p>1) male銆�a.濂虫��</p>
-                        <p>2) female銆�b.鐢锋��</p>
+                        <matching :rawData="rawDataOne" :question="matchingQuestionOne" />
                         <p><b>2.degree level</b></p>
-                        <p>1) bachelor鈥檚 degree or equivalent銆�a.鎶�鏈�/鑱屼笟鏂囧嚟</p>
-                        <p>2) doctoral degree銆�b.涓鏁欒偛</p>
-                        <p>3) master鈥檚 degree or equivalent銆�c.瀛﹀+瀛︿綅鎴栧悓绛夊鍔�</p>
-                        <p>4) secondary education銆�d.鍗氬+瀛︿綅</p>
-                        <p>5) technical/vocational diploma銆�e.纭曞+瀛︿綅鎴栧悓绛夊鍔�</p>
+                        <matching :rawData="rawDataTwo" :question="matchingQuestionTwo" />
                         <p><b>3.language level</b></p>
-                        <p>1) basic銆�a.娴佸埄</p>
-                        <p>2) fair銆�b.姣嶈</p>
-                        <p>3) fluent銆�c.宸ヤ綔鐢ㄨ</p>
-                        <p>4) native銆�d.涓�鑸�</p>
-                        <p>5) working knowledge銆�e.鍩虹姘村钩</p>
+                        <matching :rawData="rawDataThree" :question="matchingQuestionThree" />
                         <p><b>鈪�.Mark the appropriate statement for a profile.</b></p>
-                        <p><b>1.鍥界睄锛氫腑鍥�</b></p>
-                        <p>(銆�) a.Nationality:China</p>
-                        <p>(銆�) b.Nationality:Chinese</p>
-                        <p><b>2.鍖椾含甯傞珮鏂板尯鐩涢偊璺�30鍙�</b></p>
-                        <p>(銆�) a.No.30 Shengbang Road,Hi-tech Zone,Beijing</p>
-                        <p>(銆�) b.Beijing,Hi-tech Zone,Shengbang Road,No.30</p>
-                        <p><b>3.鑻辨枃娴佸埄锛屾櫘閫氳瘽姣嶈姘村钩</b></p>
-                        <p>(銆�) a.Fluent in English; native in Mandarin</p>
-                        <p>(銆�) b.I speak fluent English,and I鈥檓 a native speaker of Mandarin.</p>
-                        <p><b>4.鐔熺粌浣跨敤Word銆丒xcel鍜孭PT</b></p>
-                        <p>(銆�) a.I can use Word,Excel and PPT frequently.</p>
-                        <p>(銆�) b.Proficient user of Word,Excel and PPT</p>
-                        <p><b>5.鎷呬换涓栧崥浼氱炕璇戝拰鎺ュ緟宸ヤ綔</b></p>
-                        <p>(銆�) a.Served as an interpreter and receptionist at the World Expo</p>
-                        <p>(銆�) b.Working as an interpreter and receptionist at the World Expo</p>
+                        <div v-for="(item, index) in practicalWriting[0].value" :key="index">
+                            <p>
+                                <b>{{ index + 1 }}. {{ item.stem }} </b>
+                                <span class="icon-box" v-if="practicalWriting[0].isComplete">
+                                    <svg v-if="item.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="item.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 v-for="(citem, cindex) in item.option" :key="cindex">
+                                <input type="radio" :disabled="practicalWriting[0].isComplete" v-model="item.userAnswer"
+                                    :value="citem.value" :name="citem.stem" />
+                                {{ citem.value }}.{{ citem.txt }}
+                            </p>
+                        </div>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="practicalWriting[0].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20" v-for="(item, index) in practicalWriting[0].value" :key="index">
+                                {{ index + 1 }}.{{ item.answer }}
+                            </span>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1224,13 +3342,129 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p>鈪�<b>.A college student wants to be a volunteer in an international sports game.Please
-                                complete the following volunteer profile for him,covering the following basic
-                                information given in Chinese.</b></p>
-                        <p>鏉庢捣锛岀敺锛屼腑鍥戒汉锛�2000骞�8鏈�21鏃ュ嚭鐢燂紝鐢佃瘽鍙风爜涓�153脳脳脳脳8901锛岄偖绠辨槸simonli@
+                        <p>
+                            鈪�<b>.A college student wants to be a volunteer in an international
+                                sports game.Please complete the following volunteer profile for
+                                him,covering the following basic information given in
+                                Chinese.</b>
+                        </p>
+                        <p>
+                            鏉庢捣锛岀敺锛屼腑鍥戒汉锛�2000骞�8鏈�21鏃ュ嚭鐢燂紝鐢佃瘽鍙风爜涓�153脳脳脳脳8901锛岄偖绠辨槸simonli@
                             email.com锛岀幇灞呬綇鍦ㄥ洓宸濈渷鎴愰兘甯傚ぉ搴滃尯澶╁簻5琛�1600鍙枫�傛瘯涓氫簬鎴愰兘鑱屼笟鎶�鏈闄紝鍟嗗姟鑻辫涓撲笟锛岃幏涓撶鏂囧嚟銆傚ぇ瀛︽湡闂达紝鑰冨彇浜嗘暀甯堣祫鏍艰瘉銆侀┚鐓э紝鎺ュ彈杩囦负鏈熶袱鍛ㄧ殑鈥滄湁鏁堟矡閫氣�濆煿璁�傝嫳璇彛璇祦鍒╋紝鏅�氳瘽鏍囧噯銆�2023骞�7鏈堣嚦8鏈堬紝浣滀负蹇楁効鑰呭弬鍔犱簡涓栫晫澶у鐢熻繍鍔ㄤ細锛屼粠浜嬭繃璇█鏈嶅姟鐩稿叧宸ヤ綔銆�
                         </p>
-                        <p class="center"><img class="img-0" alt="" src="../../assets/images/0065-1.jpg" /></p>
+                        <!-- <p class="center">
+                            <img class="img-0" alt="" src="../../assets/images/0065-1.jpg" />
+                        </p> -->
+                        <div class="wating-email-box">
+                            <p class="center"> <b>Volunteer Profle</b> </p>
+                            <div>Personal information</div>
+                            <ul>
+                                <li>
+                                    Name:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[0].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                                <li>
+                                    Nationality:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[1].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                                <li>
+                                    Gender:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[2].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                                <li>
+                                    Date of birth:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[3].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                                <li>
+                                    Email address:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[4].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                                <li>
+                                    Phone number:
+                                    <input type="text" :disabled="practicalWriting[1].isComplete"
+                                        v-model="practicalWriting[1].value[5].userAnswer"
+                                        class="input-bottom-border input-bc-t" @input="saveListenThree">
+                                </li>
+                            </ul>
+                            <div>
+                                <div>Address:</div>
+                                <input type="text" :disabled="practicalWriting[1].isComplete"
+                                    v-model="practicalWriting[1].value[6].userAnswer"
+                                    class="input-bottom-border input-bc-t" @input="saveListenThree">
+                            </div>
+                            <div>Qualifications and skills</div>
+                            <div>Education background</div>
+                            <div class="fl wh-no w50">
+                                <span>Degree level:</span>
+                                <input type="text" :disabled="practicalWriting[1].isComplete"
+                                    v-model="practicalWriting[1].value[7].userAnswer"
+                                    class="input-bottom-border input-bc-t" @input="saveListenThree">
+                            </div>
+                            <div class="fl wh-no w80">
+                                <span>Major:</span>
+                                <input type="text" :disabled="practicalWriting[1].isComplete"
+                                    v-model="practicalWriting[1].value[8].userAnswer"
+                                    class="input-bottom-border input-bc-t" @input="saveListenThree">
+                            </div>
+                            <div class="fl wh-no w100">
+                                <span>University/College:</span>
+                                <input type="text" :disabled="practicalWriting[1].isComplete"
+                                    v-model="practicalWriting[1].value[8].userAnswer"
+                                    class="input-bottom-border input-bc-t" @input="saveListenThree">
+                            </div>
+                            <div>
+                                <div>Other qualifcations, short courses and training</div>
+                                <textarea name="" id="" cols="30" rows="10"
+                                    v-model="practicalWriting[1].value[9].userAnswer" class="w100"></textarea>
+                            </div>
+                            <div class="fl wh-no w100">
+                                <span>Language level:</span>
+                                <input type="text" :disabled="practicalWriting[1].isComplete"
+                                    v-model="practicalWriting[1].value[8].userAnswer"
+                                    class="input-bottom-border input-bc-t" @input="saveListenThree">
+                            </div>
+                            <div>
+                                <div>Volunteering experience</div>
+                                <textarea name="" id="" cols="30" rows="10"
+                                    v-model="practicalWriting[1].value[9].userAnswer" class="w100"></textarea>
+                            </div>
+                        </div>
+                        <div class="event-header-text-bc pd-5 w100 mt-20" v-if="practicalWriting[1].isShowAnswer">
+                            <span>绛旀锛�</span>
+                            <span class="mr-20" v-for="(item, index) in practicalWriting[1].value" :key="index">
+                                {{ index + 1 }}.{{ item.answer }}
+                            </span>
+                        </div>
+                        <!-- 鎻愪氦鎸夐挳 -->
+                        <div class="w100 fl">
+                            <ul class="fl ju-ar w100">
+                                <li>
+                                    <button class="btn-border btn-w" @click="handlePracticalWriting">
+                                        鎻愪氦
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="recastPracticalWriting" class="btn-border btn-w">
+                                        閲嶅仛
+                                    </button>
+                                </li>
+                                <li>
+                                    <button @click="viewPracticalWriting" class="parimary-btn">
+                                        鏌ョ湅绛旀
+                                    </button>
+                                </li>
+                            </ul>
+                        </div>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1256,20 +3490,52 @@
                         <div class="un-h2">
                             <h2 id="b012">Unit Project</h2>
                         </div>
-                        <p>The China International Import Expo committee is calling for volunteers to serve in the
-                            expo.The volunteer association in your college is in charge of the first-round recruitment
-                            and selection.Work in a group of four.Two group members play the roles of applicants and two
-                            play the role of interviewers.Complete the following worksheets,and then conduct the
-                            interview.</p>
+                        <p>
+                            The China International Import Expo committee is calling for
+                            volunteers to serve in the expo.The volunteer association in your
+                            college is in charge of the first-round recruitment and
+                            selection.Work in a group of four.Two group members play the roles
+                            of applicants and two play the role of interviewers.Complete the
+                            following worksheets,and then conduct the interview.
+                        </p>
                         <p><b>Role 1:Interviewer</b></p>
-                        <p>1.Work with your partner and create a volunteer evaluation rubric.</p>
-                        <p>2.Prepare a list of questions you will ask during the interview.</p>
+                        <p>
+                            1.Work with your partner and create a volunteer evaluation rubric.
+                        </p>
+                        <p>
+                            2.Prepare a list of questions you will ask during the interview.
+                        </p>
                         <p><b>Role 2:Applicant</b></p>
                         <p>1.Prepare a self-introduction.</p>
-                        <p>2.Make a list of your information which might be useful in the interview.</p>
-                        <p class="left"><img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" /></p>
-                        <p><b>Worksheet for the Applicant</b></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0066-1.jpg" /></p>
+                        <p>
+                            2.Make a list of your information which might be useful in the
+                            interview.
+                        </p>
+                        <p class="left">
+                            <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+                        </p>
+                        <p class="center"><b>Worksheet for the Applicant</b></p>
+                        <p class="center fl ju-cn">
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff; width: 80%;"
+                            class="fz-14 center">
+                            <tr class="table-tr-bc">
+                                <td style="text-align: left">
+                                    Self-introduction:
+                                    <textarea v-model="noSubmitData[2].value[0].userAnswer" rows="6"
+                                        class="w100 table-tr-bc  table-textarea w95"
+                                        @change="saveNoSubmitData"></textarea>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td style="text-align: left">
+                                    Questions that could be asked and your answers:
+                                    <textarea v-model="noSubmitData[2].value[1].userAnswer" rows="6"
+                                        class="w100 table-tr-bc  table-textarea w95"
+                                        @change="saveNoSubmitData"></textarea>
+                                </td>
+                            </tr>
+                        </table>
+                        </p>
                     </div>
                 </div>
                 <div class="preface-bottom">
@@ -1292,8 +3558,28 @@
                 <!-- 鍐呭 -->
                 <div class="padding-93">
                     <div class="bodystyle">
-                        <p><b>Worksheet for the Interviewer</b></p>
-                        <p class="center"><img class="img-a" alt="" src="../../assets/images/0067-1.jpg" /></p>
+                        <p class="center"><b>Worksheet for the Interviewer</b></p>
+                        <p class="center fl ju-cn">
+                        <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff; width: 80%;"
+                            class="fz-14 center">
+                            <tr class="table-tr-bc">
+                                <td style="text-align: left">
+                                    The volunteer evaluation rubric:
+                                    <textarea v-model="noSubmitData[2].value[2].userAnswer" rows="6"
+                                        class="w100 table-tr-bc  table-textarea w95"
+                                        @change="saveNoSubmitData"></textarea>
+                                </td>
+                            </tr>
+                            <tr class="table-tr-bc">
+                                <td style="text-align: left">
+                                    Question list:
+                                    <textarea v-model="noSubmitData[2].value[3].userAnswer" rows="6"
+                                        class="w100 table-tr-bc  table-textarea w95"
+                                        @change="saveNoSubmitData"></textarea>
+                                </td>
+                            </tr>
+                        </table>
+                        </p>
                         <div class="fieldset-1">
                             <p class="center"><b>Useful Expressions</b></p>
                             <p><b>For the interviewer</b>:</p>
@@ -1304,84 +3590,166 @@
                             <p>Could you give me a specific example of how you did that?</p>
                             <p>Do you have any questions for us?</p>
                             <p><b>For the applicant</b>:</p>
-                            <p>As you can see in my profile/As you can probably learn from the profile,I graduated from/
-                                am studying in ...</p>
+                            <p>
+                                As you can see in my profile/As you can probably learn from the
+                                profile,I graduated from/ am studying in ...
+                            </p>
                             <p>I majored in ...</p>
                             <p>I鈥檝e volunteered as ...in ...for ...</p>
                             <p>I鈥檓 skillful at ...</p>
                             <p>I鈥檓 fluent in English/...</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">57</span>
-                </div>
-            </div>
-        </div>
-
-        <!-- 绗洓鍗曞厓 -->
-        <!-- 58 -->
-        <div class="page-box" page="64">
-            <div v-if="showPageList.indexOf(64) > -1">
-                <!-- 澶撮儴 -->
-                <div class="w100 mb-20" style="padding-right: 20px">
-                    <div class="event-header-bc-unit3 fl al-end" style="height: 100px; padding-left: 40px">
-                        <div class="preface-header-box event-header-text-bc-unit3">
-                            <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
-                            <span class="g-text event-text-color-unit3">鍩虹妯″潡涓�</span>
-                        </div>
-                    </div>
-                </div>
-                <!-- 鍐呭 -->
-                <div class="padding-93">
-                    <div class="bodystyle">
-
-                    </div>
-                    <div class="preface-bottom">
-                        <span class="contet-num-box">58</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-         <!-- 59 -->
-        <div class="page-box" page="65">
-            <div v-if="showPageList.indexOf(65) > -1">
-                <!-- 澶撮儴 -->
-                <ul class="preface-odd-header w100 fl ju-bt">
-                    <li class=""></li>
-                    <li class="fz-18">
-                        <span class="chapter-left-bc-unit3">MODULE 3</span>
-                        <span class="chapter-right-bc-unit3 fw-bl chapter-right-cl-unit3">A BETTER WORLD WITH
-                            VOLUNTEERS</span>
-                    </li>
-                </ul>
-                <!-- 鍐呭 -->
-                <div class="padding-93">
-                    <div class="bodystyle"></div>
-                </div>
-                <div class="preface-bottom">
-                    <span class="contet-num-box">39</span>
-                </div>
-            </div>
-        </div>
-        <!-- 60 -->
-        <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-unit3 fl al-end" style="height: 100px; padding-left: 40px">
-                        <div class="preface-header-box event-header-text-bc-unit3">
-                            <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
-                            <span class="g-text event-text-color-unit3">鍩虹妯″潡涓�</span>
-                        </div>
-                    </div>
-                </div>
-                <!-- 鍐呭 -->
-                <div class="padding-93">
-                    <div class="bodystyle"></div>
-                </div>
-                <div class="preface-bottom">
-                    <span class="contet-num-box">12</span>
                 </div>
             </div>
         </div>
@@ -1401,49 +3769,52 @@
     },
     data() {
         return {
-            imgThirteen: require("../../assets/images/grammar.jpg"),
+            imgThirteen: require("../../assets/images/grammar3-1.png"),
+            imgThirteenOne: require("../../assets/images/grammar3-1.png"),
             showAnswerOne: false,
+            showLessonOneQuestionAnswer: false,
             showAnswerTwo: false,
             showAnswerThree: false,
             showAnswerFour: false,
             showAnswerFive: false,
             showImg: false,
+            showImgOne: false,
             showQuestionAnswer: false,
             rawData: {
                 left: [
                     {
                         oldId: "FB34",
-                        txt: "Martin銆�銆�銆�銆�Silk",
+                        txt: "Paragraph 2",
                     },
                     {
                         oldId: "64D6",
-                        txt: "Jessica銆�銆�The Great Wall",
+                        txt: "Paragraph 3",
                     },
                     {
                         oldId: "2ED4",
-                        txt: "Soren銆�銆�Chinese Food",
+                        txt: "Paragraph 4",
                     },
                     {
                         oldId: "44DE",
-                        txt: "Chinese銆�銆�銆�銆�Tea",
+                        txt: "Paragraph 5",
                     },
                 ],
                 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.Volunteering can advance your career.",
                     },
                     {
                         oldId: "44DE",
-                        txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
+                        txt: "b.Volunteering brings fun and fulfillment to your life.",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "c.Volunteering is good for your mind.",
+                    },
+                    {
+                        oldId: "FB34",
+                        txt: "d.Volunteering connects you to your community.",
                     },
                 ],
             },
@@ -1454,66 +3825,63 @@
                 answer: [
                     {
                         id: "FB34",
-                        linkValue:
-                            "The clothing material is quite popular among Roman women inancient times.",
-                        value: "Silk",
+                        linkValue: "d.Volunteering connects you to your community.",
+                        value: "Paragraph 2",
                     },
                     {
                         id: "64D6",
-                        linkValue:
-                            "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
-                        value: "The Great Wall",
+                        linkValue: "c.Volunteering is good for your mind.",
+                        value: "Paragraph 3",
                     },
                     {
                         id: "2ED4",
-                        linkValue:
-                            "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
-                        value: "Chinese Food",
+                        linkValue: "a.Volunteering can advance your career.",
+                        value: "Paragraph 4",
                     },
                     {
                         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",
+                        linkValue: "b.Volunteering brings fun and fulfillment to your life.",
+                        value: "Paragraph 5",
                     },
                 ],
                 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.Volunteering can advance your career.",
                         },
                         {
                             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.Volunteering brings fun and fulfillment to your life.",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "c.Volunteering is good for your mind.",
                         },
                         {
                             oldId: "FB34",
-                            txt: "The clothing material is quite popular among Roman women inancient times.",
-                        },
-                        {
-                            oldId: "2ED4",
-                            txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
+                            txt: "d.Volunteering connects you to your community.",
                         },
                     ],
                     values: [
                         {
                             oldId: "FB34",
-                            txt: "Martin  Silk",
+                            txt: "Paragraph 2",
                         },
                         {
                             oldId: "64D6",
-                            txt: "The Great Wall",
+                            txt: "Paragraph 3",
                         },
                         {
                             oldId: "2ED4",
-                            txt: "Chinese Food",
+                            txt: "Paragraph 4",
                         },
                         {
                             oldId: "44DE",
-                            txt: "Chinese Tea",
+                            txt: "Paragraph 5",
                         },
                     ],
                 },
@@ -1525,7 +3893,79 @@
                 titleDescription: "1",
                 userChoise: [],
                 value: [],
-                answerImg: require("../../assets/images/matching-one.png"),
+                answerImg: require("../../assets/images/matching-two.png"),
+            },
+            rawDataOne: {
+                left: [
+                    {
+                        oldId: "FB34",
+                        txt: "1) male",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "2) female",
+                    },
+                ],
+                right: [
+                    {
+                        oldId: "64D6",
+                        txt: "a.濂虫��",
+                    },
+                    {
+                        oldId: "FB34",
+                        txt: "b.鐢锋��",
+                    },
+                ],
+            },
+            matchingQuestionOne: {
+                KnowledgePoint: "123",
+                analysis: "123",
+                answer: [
+                    {
+                        id: "FB34",
+                        linkValue: "b.鐢锋��",
+                        value: "1) male",
+                    },
+                    {
+                        id: "64D6",
+                        linkValue: "a.濂虫��",
+                        value: "2) female",
+                    },
+                ],
+                optionStyle: undefined,
+                id: 489306,
+                // 娉ㄦ剰锛岃繖閲岀殑椤哄簭搴旇鑷笂鑰屼笅锛屽繀椤诲拰棰樹竴鑷�
+                options: {
+                    linkValues: [
+                        {
+                            oldId: "64D6",
+                            txt: "a.濂虫��",
+                        },
+                        {
+                            oldId: "FB34",
+                            txt: "b.鐢锋��",
+                        },
+                    ],
+                    values: [
+                        {
+                            oldId: "FB34",
+                            txt: "1) male",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "2) female",
+                        },
+                    ],
+                },
+                questionType: "matching",
+                stem: {
+                    stemTxt: "鎸夐『搴忚繛绾�",
+                },
+                stemStyle: undefined,
+                titleDescription: "1",
+                userChoise: [],
+                value: [],
+                answerImg: require("../../assets/images/matching-7.png"),
             },
             questionData: {
                 warnUp: {
@@ -1573,11 +4013,286 @@
                     five: "",
                     six: "",
                     seven: "",
-                    enight: "",
+                    eight: "",
                     nine: "",
                 },
             },
+            rawDataTwo: {
+                left: [
+                    {
+                        oldId: "FB34",
+                        txt: "1) bachelor鈥檚 degree or equivalent",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "2) doctoral degree",
+                    },
+                    {
+                        oldId: "2ED4",
+                        txt: "3) master鈥檚 degree or equivalent",
+                    },
+                    {
+                        oldId: "44DE",
+                        txt: "4) secondary education",
+                    },
+                    {
+                        oldId: "43DB",
+                        txt: "5) technical/vocational diploma",
+                    }
+                ],
+                right: [
+                    {
+                        oldId: "43DB",
+                        txt: "a.鎶�鏈�/鑱屼笟鏂囧嚟",
+                    },
+
+                    {
+                        oldId: "44DE",
+                        txt: "b.涓鏁欒偛",
+                    },
+                    {
+                        oldId: "FB34",
+                        txt: "c.瀛﹀+瀛︿綅鎴栧悓绛夊鍔�",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "d.鍗氬+瀛︿綅",
+                    },
+                    {
+                        oldId: "2ED4",
+                        txt: "纭曞+瀛︿綅鎴栧悓绛夊鍔�",
+                    },
+                ],
+            },
+            matchingQuestionTwo: {
+                KnowledgePoint: "123",
+                analysis: "123",
+                answer: [
+                    {
+                        id: "FB34",
+                        linkValue: "c.瀛﹀+瀛︿綅鎴栧悓绛夊鍔�",
+                        value: "1) bachelor鈥檚 degree or equivalent",
+                    },
+                    {
+                        id: "64D6",
+                        linkValue: "d.鍗氬+瀛︿綅",
+                        value: "2) doctoral degree",
+                    },
+                    {
+                        id: "2ED4",
+                        linkValue: "纭曞+瀛︿綅鎴栧悓绛夊鍔�",
+                        value: "3) master鈥檚 degree or equivalent",
+                    },
+                    {
+                        id: "44DE",
+                        linkValue: "b.涓鏁欒偛",
+                        value: "4) secondary education",
+                    },
+                    {
+                        id: "43DB",
+                        linkValue: "a.鎶�鏈�/鑱屼笟鏂囧嚟",
+                        value: "5) technical/vocational diploma",
+                    }
+                ],
+                optionStyle: undefined,
+                id: 489306,
+                // 娉ㄦ剰锛岃繖閲岀殑椤哄簭搴旇鑷笂鑰屼笅锛屽繀椤诲拰棰樹竴鑷�
+                options: {
+                    linkValues: [
+                        {
+                            oldId: "43DB",
+                            txt: "a.鎶�鏈�/鑱屼笟鏂囧嚟",
+                        },
+
+                        {
+                            oldId: "44DE",
+                            txt: "b.涓鏁欒偛",
+                        },
+                        {
+                            oldId: "FB34",
+                            txt: "c.瀛﹀+瀛︿綅鎴栧悓绛夊鍔�",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "d.鍗氬+瀛︿綅",
+                        },
+                        {
+                            oldId: "2ED4",
+                            txt: "纭曞+瀛︿綅鎴栧悓绛夊鍔�",
+                        },
+                    ],
+                    values: [
+                        {
+                            oldId: "FB34",
+                            txt: "1) bachelor鈥檚 degree or equivalent",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "2) doctoral degree",
+                        },
+                        {
+                            oldId: "2ED4",
+                            txt: "3) master鈥檚 degree or equivalent",
+                        },
+                        {
+                            oldId: "44DE",
+                            txt: "4) secondary education",
+                        },
+                        {
+                            oldId: "43DB",
+                            txt: "5) technical/vocational diploma",
+                        }
+                    ],
+                },
+                questionType: "matching",
+                stem: {
+                    stemTxt: "鎸夐『搴忚繛绾�",
+                },
+                stemStyle: undefined,
+                titleDescription: "1",
+                userChoise: [],
+                value: [],
+                answerImg: require("../../assets/images/matching-8.png"),
+            },
+            rawDataThree: {
+                left: [
+                    {
+                        oldId: "FB34",
+                        txt: "1) basic",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "2) fair",
+                    },
+                    {
+                        oldId: "2ED4",
+                        txt: "3) fluent",
+                    },
+                    {
+                        oldId: "44DE",
+                        txt: "4) native",
+                    },
+                    {
+                        oldId: "43DB",
+                        txt: "5) working knowledge",
+                    }
+                ],
+                right: [
+                    {
+                        oldId: "2ED4",
+                        txt: "a.娴佸埄",
+                    },
+                    {
+                        oldId: "44DE",
+                        txt: "b.姣嶈",
+                    },
+                    {
+                        oldId: "43DB",
+                        txt: "c.宸ヤ綔鐢ㄨ",
+                    },
+                    {
+                        oldId: "64D6",
+                        txt: "d.涓�鑸�",
+                    },
+                    {
+                        oldId: "FB34",
+                        txt: "e.鍩虹姘村钩",
+                    },
+
+                ],
+            },
+            matchingQuestionThree: {
+                KnowledgePoint: "123",
+                analysis: "123",
+                answer: [
+                    {
+                        id: "FB34",
+                        linkValue: "e.鍩虹姘村钩",
+                        value: "1) basic",
+                    },
+                    {
+                        id: "64D6",
+                        linkValue: "d.涓�鑸�",
+                        value: "2) fair",
+                    },
+                    {
+                        id: "2ED4",
+                        linkValue: "a.娴佸埄",
+                        value: "3) fluent",
+                    },
+                    {
+                        id: "44DE",
+                        linkValue: "b.姣嶈",
+                        value: "4) native",
+                    },
+                    {
+                        id: "43DB",
+                        linkValue: "c.宸ヤ綔鐢ㄨ",
+                        value: "5) working knowledge",
+                    }
+                ],
+                optionStyle: undefined,
+                id: 489306,
+                // 娉ㄦ剰锛岃繖閲岀殑椤哄簭搴旇鑷笂鑰屼笅锛屽繀椤诲拰棰樹竴鑷�
+                options: {
+                    linkValues: [
+                        {
+                            oldId: "2ED4",
+                            txt: "a.娴佸埄",
+                        },
+                        {
+                            oldId: "44DE",
+                            txt: "b.姣嶈",
+                        },
+
+                        {
+                            oldId: "64D6",
+                            txt: "d.涓�鑸�",
+                        },
+                        {
+                            oldId: "FB34",
+                            txt: "e.鍩虹姘村钩",
+                        },
+                        {
+                            oldId: "43DB",
+                            txt: "c.宸ヤ綔鐢ㄨ",
+                        },
+                    ],
+                    values: [
+                        {
+                            oldId: "FB34",
+                            txt: "1) basic",
+                        },
+                        {
+                            oldId: "64D6",
+                            txt: "2) fair",
+                        },
+                        {
+                            oldId: "2ED4",
+                            txt: "3) fluent銆�c.宸ヤ綔鐢ㄨ",
+                        },
+                        {
+                            oldId: "44DE",
+                            txt: "4) native",
+                        },
+                        {
+                            oldId: "43DB",
+                            txt: "5) working knowledge",
+                        }
+                    ],
+                },
+                questionType: "matching",
+                stem: {
+                    stemTxt: "鎸夐『搴忚繛绾�",
+                },
+                stemStyle: undefined,
+                titleDescription: "1",
+                userChoise: [],
+                value: [],
+                answerImg: require("../../assets/images/matching-9.png"),
+            },
             testData: {
+                isComplete: false,
                 check: [],
                 tx: {
                     one: "",
@@ -1592,6 +4307,16 @@
                     three: "",
                     four: "",
                     five: "",
+                    six: "",
+                    isRight: null,
+                    answer: [
+                        "normous",
+                        "oost",
+                        "nxiety",
+                        "ortality",
+                        "nergizing",
+                        "assion",
+                    ],
                 },
                 line: {
                     one: "",
@@ -1625,6 +4350,10 @@
                 listenOne: "",
                 readingOne: "",
                 readingTwo: "",
+                readingThree: "",
+                readingFour: "",
+                listenTwo: "",
+                listenThree: ""
             },
             dropDownList: [
                 "animal rescue and care",
@@ -1654,26 +4383,807 @@
                     answer: "animal rescue and care",
                 },
             },
+            // 鏂板
+            // 鍙渶濉┖鐨勯
+            noSubmitData: [
+                {
+                    type: "shortAnswer",
+                    value: [
+                        {
+                            userAnswer: "",
+                            isShowAnswer: false
+                        },
+                        {
+                            userAnswer: "",
+                            isShowAnswer: false,
+                        },
+                        {
+                            userAnswer: "",
+                            isShowAnswer: false,
+                        }
+                    ]
+                },
+                {
+                    type: 'table',
+                    value: [
+                        {
+                            userAnswer: "",
+                        },
+                        {
+                            userAnswer: "",
+                        },
+                        {
+                            userAnswer: "",
+                        },
+                        {
+                            userAnswer: ""
+                        },
+                        {
+                            userAnswer: ""
+                        },
+                        {
+                            userAnswer: ""
+                        },
+                        {
+                            userAnswer: ""
+                        },
+                        {
+                            userAnswer: ""
+                        },
+                    ]
+                },
+                {
+                    type: 'worksheet',
+                    value: [
+                        {
+                            userAnswer: '',
+                        },
+                        {
+                            userAnswer: '',
+                        },
+                        {
+                            userAnswer: '',
+                        },
+                        {
+                            userAnswer: '',
+                        },
+                    ]
+                },
+                {
+                    type:'shortAnswer',
+                    value:[
+                        {
+                            userAnswer:'',
+                            answer:[
+                                'China Rural Doctors Program',
+                                'China Foundation for Rural Development',
+                                'Shanghai Oasis Green Food Bank',
+                                '閽变竷铏�(Qian Qihu)'
+                            ],
+                            isShowAnswer:false,
+                        },
+                        {
+                            userAnswer:'',
+                            answer:[
+                                'China Rural Doctors Program helps to improve the medical treatment levels of the rural doctors so that people in the rural areas can receive more proper treatments when getting ill.',
+                                'Over the eight years of battle against poverty, China Foundation for Rural Development has raised RMB 5.199 billion of funds and materials in total and benefited 35.3776 million person-times.',
+                                'Since 2014, Oasis Food Bank has helped 234 food manufacturers save over 755 tons of food that would have been wasted. 285 non-profit organizations, communities, and schools have become authorized distribution points. Over 80,000 volunteers have participated in sorting and distributing surplus food for people in need.',
+                                'Qian has spent over 60 years studying protection engineering, helping China to build an indestructible 鈥淯nderground Steel Great Wall.鈥� He proposed and realized the defensive requirements in the construction of subways across the country. Not only defensive infrastructure, but also many national projects that already play a key part in Chinese people鈥檚 life have links to his work, including the Nanjing Yangtze River Tunnel, the Hong Kong-Zhuhai-Macao Bridge, and the giant South-to-North Water Transfer Project. And his generosity has helped a lot of children in need.',
+                            ],
+                            isShowAnswer:false,
+                        },
+                    ]
+                }
+            ],
+            listenOne: [
+                {
+                    id: 0,
+                    value: '',
+                    stem: "Why do you want to be a volunteer?",
+                    option: ['You can change lives.', 'You can stay with friends.', 'You can teach new skills.', 'You can make more money.'],
+                    answer: 'You can change lives.',
+                    isRight: null,
+                    isComplete: false,
+                    isShowAnswer: false,
+                },
+                {
+                    id: 1,
+                    value: '',
+                    stem: 'Who are more likely to be volunteers?',
+                    option: [' College students.', 'Nonprofessionals.', 'People without jobs.', 'Children.'],
+                    answer: 'College students',
+                    isRight: null,
+                    isComplete: false,
+                    isShowAnswer: false,
+                },
+                {
+                    id: 3,
+                    value: '',
+                    stem: '.Which activity is NOT mentioned in the video?',
+                    option: ['Volunteering in sport.', 'Emergency services.', 'Helping people with disabilities.', 'Teaching.'],
+                    answer: 'Helping people with disabilities.',
+                    isRight: null,
+                    isComplete: false,
+                    isShowAnswer: false,
+                },
+            ],
+            wordsOne: [
+                {
+                    type: "judge",
+                    isShowAnswer: false,
+                    isComplete: false,
+                    value: [
+                        {
+                            answer: "a",
+                            userAnswer: "",
+                        },
+                        {
+                            answer: "d",
+                            userAnswer: "",
+                        },
+                        {
+                            answer: "c",
+                            userAnswer: "",
+                        },
+                        {
+                            answer: "d",
+                            userAnswer: ""
+                        },
+                        {
+                            answer: "b",
+                            userAnswer: ""
+                        },
+                    ]
+                },
+                {
+                    type: 'fill',
+                    isShowAnswer: false,
+                    isComplete: false,
+                    value: [
+                        {
+                            userAnswer: "",
+                            answer: "enormous",
+                            isRight: null
+                        },
+                        {
+                            userAnswer: "",
+                            answer: "boost",
+                            isRight: null
+                        },
+                        {
+                            userAnswer: "",
+                            answer: "anxiety",
+                            isRight: null
+                        },
+                        {
+                            userAnswer: "",
+                            answer: "mortality",
+                            isRight: null
+                        },
+                        {
+                            userAnswer: "",
+                            answer: "energizing",
+                            isRight: null
+                        },
+                        {
+                            userAnswer: "",
+                            answer: "passion",
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'shortAnswer',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            stem: 'help out',
+                            userAnswer: '',
+                            answer: 'I helped out with the check-in of athletes at the sports game.',
+                            isRight: null
+                        },
+                        {
+                            stem: 'make a difference',
+                            userAnswer: '',
+                            answer: 'No matter how small the deed is, it will make a difference to people who are in need.',
+                            isRight: null
+                        },
+                        {
+                            stem: 'stretch one鈥檚 wings',
+                            userAnswer: '',
+                            answer: 'Your experience of volunteering will help you to stretch your wings in your future career.',
+                            isRight: null
+                        },
+                        {
+                            stem: 'what鈥檚 more',
+                            userAnswer: '',
+                            answer: 'Volunteering does good to one鈥檚 body; what鈥檚 more, it鈥檚 also good for one鈥檚 mental health.',
+                            isRight: null
+                        },
+                        {
+                            stem: 'carry over',
+                            userAnswer: '',
+                            answer: 'The spirit of volunteering will be carried over from generation to generation.',
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'translate',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            userAnswer: '',
+                            answer: '鍔犲叆瀛︽牎閲岀殑闈掑勾蹇楁効鑰呭崗浼氭墿澶т簡濂圭殑鏈嬪弸鍦�',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: '鏈嶅姟2022鐨勫寳浜啲濂ヤ細鏄竴娆¢潪甯告湁鎰忎箟涓旇浜洪毦蹇樼殑缁忓巻',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: '瀵瑰瀛愪滑鐨勬壙璇鸿濂瑰湪杩欐墍涔℃潙灏忓鍋氫簡涓�杈堝瓙鐨勮�佸笀',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: '鍙備笌涓嶅悓鐨勫織鎰胯�呴」鐩府鍔╀粬鎴愰暱涓轰簡涓�涓湁杩滆鐨勪汉',
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'grammar',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            userAnswer: '',
+                            answer: 'is considering',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'am planning',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'are doing',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'are putting',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'is having',
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'describe',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            userAnswer: '',
+                            answer: 'The volunteer is tutoring the children.',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'Students are helping with farming.',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'A group of volunteers are cleaning up trashes on the beach.',
+                            isRight: null
+                        },
+                        {
+                            userAnswer: '',
+                            answer: 'The little girl is holding a donation box full of clothes.',
+                            isRight: null
+                        },
+                    ]
+                }
+            ],
+            miniTable: [
+                {
+                    value: [
+                        {
+                            userAnswer: ""
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                    ]
+                },
+                {
+                    value: [
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                        {
+                            userAnswer: ''
+                        },
+                    ]
+                }
+            ],
+            listenTwo: [
+                {
+                    type: "fill ",
+                    isShowAnswer: false,
+                    isComplete: false,
+                    value: [
+                        {
+                            answer: 604,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: 1083,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: 63,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: 4500,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: 47,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: 100000,
+                            userAnswer: "",
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: "dropdown",
+                    isComplete: false,
+                    isShowAnswer: false,
+                    option: ['T', 'F'],
+                    value: [
+                        {
+                            stem: "Showing compassion and being patient are qualities needed for training.",
+                            answer: 'T',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            stem: "Women have to overcome a lot of difficulties to attend Barefoot College.",
+                            answer: 'T',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            stem: "Half of the courses in the training are done in sign language.",
+                            answer: 'F',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            stem: "Husbands are always supportive for wives to go for training.",
+                            answer: 'F',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            stem: "The training helps women gain respect for the changes they brought in.",
+                            answer: 'T',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'fill',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            stem: "In far-away areas,only the old and the kids are left.",
+                            answer: "remote",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            stem: "The government works on ways to fight against poverty.",
+                            answer: "solutions",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            stem: "People having no access to electricity mainly live in Africa.",
+                            answer: "primarily",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            stem: "Some college students choose to join volunteering programs after graduation.",
+                            answer: "attend",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            stem: "Family reunion is a usual way to celebrate the Spring Festival.",
+                            answer: "Traditional",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: "fill",
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            answer: "came up with",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: "went over to",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: ["ended", "with"],
+                            userAnswer: ["", ""],
+                            isRight: null
+                        },
+                        {
+                            answer: "lit up",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                        {
+                            answer: "are faced with",
+                            userAnswer: "",
+                            isRight: null
+                        },
+                    ]
+                }
+            ],
+            miniProjectTwo: [
+                {
+                    type: 'choice',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    option: [
+                        'Hold the elevator for the lady',
+                        'Catch the balloon for the kid',
+                        'Stop the shopping cart',
+                        'Teach kids to swim',
+                        'Help the old cross the street',
+                        'Plant trees in the park'
+                    ],
+                    value: [
+                        {
+                            answer: ['Hold the elevator for the lady'],
+                            userAnswer: []
+                        }
+                    ]
+                }
+            ],
+            listenThree: [
+                {
+                    type: 'fill',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            answer: 'directions',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'volunteer',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'actually',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'retired',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'spend',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'tourists',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'throwing',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                        {
+                            answer: 'happiness',
+                            userAnswer: '',
+                            isRight: null
+                        },
+                    ]
+                },
+                {
+                    type: 'fill',
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            stem: 'When did Mr.Crossman start volunteering?',
+                            answer: 'He started volunteering in March 2017 after his retirement.',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: 'Why was volunteering not easy in the beginning?',
+                            answer: 'He was unfamiliar with the surroundings.',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: 'What makes him popular?',
+                            answer: 'He speaks fluent Chinese.',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: 'What鈥檚 his understanding of the volunteering spirit?',
+                            answer: 'You get more than what you give in a way.',
+                            userAnswer: ''
+                        },
+                    ]
+                }
+            ],
+            practicalWriting: [
+                {
+                    type: 'radio',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            stem: '鍥界睄锛氫腑鍥�',
+                            option: [
+                                {
+                                    value: 'a',
+                                    txt: 'Nationality:China'
+                                },
+                                {
+                                    value: 'b',
+                                    txt: 'Nationality:Chinese'
+                                }
+                            ],
+                            answer: 'b',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: '鍖椾含甯傞珮鏂板尯鐩涢偊璺�30鍙�',
+                            option: [
+                                {
+                                    value: 'a',
+                                    txt: 'No.30 Shengbang Road,Hi-tech Zone,Beijing'
+                                },
+                                {
+                                    value: 'b',
+                                    txt: 'Beijing,Hi-tech Zone,Shengbang Road,No.30'
+                                }
+                            ],
+                            answer: 'a',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: '鑻辨枃娴佸埄锛屾櫘閫氳瘽姣嶈姘村钩',
+                            option: [
+                                {
+                                    value: 'a',
+                                    txt: 'Fluent in English; native in Mandarin'
+                                },
+                                {
+                                    value: 'b',
+                                    txt: 'I speak fluent English,and I鈥檓 a native speaker of Mandarin.'
+                                }
+                            ],
+                            answer: 'a',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: '鐔熺粌浣跨敤Word銆丒xcel鍜孭PT',
+                            option: [
+                                {
+                                    value: 'a',
+                                    txt: 'I can use Word,Excel and PPT frequently.'
+                                },
+                                {
+                                    value: 'b',
+                                    txt: 'Proficient user of Word,Excel and PPT'
+                                }
+                            ],
+                            answer: 'b',
+                            userAnswer: ''
+                        },
+                        {
+                            stem: '鎷呬换涓栧崥浼氱炕璇戝拰鎺ュ緟宸ヤ綔',
+                            option: [
+                                {
+                                    value: 'a',
+                                    txt: 'Served as an interpreter and receptionist at the World Expo'
+                                },
+                                {
+                                    value: 'b',
+                                    txt: 'Working as an interpreter and receptionist at the World Expo'
+                                }
+                            ],
+                            answer: 'a',
+                            userAnswer: ''
+                        },
+                    ]
+                },
+                {
+                    type: 'email',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            answer: 'Li Hai',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Chinese',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Male',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: '21/08/2000',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'simonli@email.com',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: '1532788901',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'No. 1600, 5th Tianfu Street, Tianfu District, Chengdu',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Vocational diploma',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Business English',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Chengdu Polytechnic',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Teacher鈥檚 certificate; Driving license;Two-week training on effective communication.',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Fluent in English; native in Mandarin',
+                            userAnswer: ''
+                        },
+                        {
+                            answer: 'Served as a member of organizing committee of FISU World University Games 07/2022- 08/2022; Provided language service.',
+                            userAnswer: ''
+                        },
+                    ]
+                },
+                {
+                    type: 'checkbox',
+                    isComplete: false,
+                    isShowAnswer: false,
+                    value: [
+                        {
+                            answer: ['Personal information', 'Skills and qualifications', 'Education background', 'Interests', 'Volunteering experience'],
+                            userAnswer: []
+                        }
+                    ]
+                },
+            ],
         };
     },
     mounted() {
         const testData = localStorage.getItem("english-testOne");
-        if (testData) {
-            this.testData = JSON.parse(testData);
-        }
+        if (testData) this.testData = JSON.parse(testData);
         const bookQuestion = localStorage.getItem("english-book-question-one");
-        if (bookQuestion) {
-            this.questionData = JSON.parse(bookQuestion);
-        }
-        const dropdownData = localStorage.getItem("english-dropdown-one");
-        if (dropdownData) {
-            this.dropdownData = JSON.parse(dropdownData);
-        }
+        if (bookQuestion) this.questionData = JSON.parse(bookQuestion);
+        const dropdownData = localStorage.getItem("english-dropdown-three");
+        if (dropdownData) this.dropdownData = JSON.parse(dropdownData);
+        // 鏂板
+        const listenOne = localStorage.getItem("english-chapter03-listenOne");
+        if (listenOne) this.listenOne = JSON.parse(listenOne)
+        const noSubmitData = localStorage.getItem('english-chapter03-noSubmitData')
+        if (noSubmitData) this.noSubmitData = JSON.parse(noSubmitData);
+        const wordsOne = localStorage.getItem('english-chapter03-wordsOne')
+        if (wordsOne) this.wordsOne = JSON.parse(wordsOne)
+        const miniTable = localStorage.getItem('english-chapter03-miniTable')
+        if (miniTable) this.miniTable = JSON.parse(miniTable)
+        const listenTwo = localStorage.getItem('english-chapter03-listenTwo')
+        if (listenTwo) this.listenTwo = JSON.parse(listenTwo)
+        const miniProjectTwo = localStorage.getItem('english-chapter03-miniProjectTwo')
+        if (miniProjectTwo) this.miniProjectTwo = JSON.parse(miniProjectTwo)
+        const listenThree = localStorage.getItem('english-chapter03-listenThree')
+        if (listenThree) this.listenThree = JSON.parse(listenThree)
+        const practicalWriting = localStorage.getItem('english-chapter03-practicalWriting')
+        if (practicalWriting) this.practicalWriting = JSON.parse(practicalWriting)
         this.getPath();
+
+
     },
     methods: {
-        saveWord(event, word) {
-            this.$emit("saveCharacters", event, word);
+        arrayToString(data) {
+            if (Array.isArray(data)) {
+                return data.toString()
+            } else {
+                return data
+            }
         },
         setTestData() {
             localStorage.setItem("english-testOne", JSON.stringify(this.testData));
@@ -1695,6 +5205,16 @@
                     three: "",
                     four: "",
                     five: "",
+                    six: "",
+                    isRight: null,
+                    answer: [
+                        "normous",
+                        "oost",
+                        "nxiety",
+                        "ortality",
+                        "nergizing",
+                        "assion",
+                    ],
                 },
                 line: {
                     one: "",
@@ -1726,7 +5246,6 @@
             };
         },
         setBookQuestion() {
-            console.log("淇濆瓨");
             localStorage.setItem(
                 "english-book-question-one",
                 JSON.stringify(this.questionData)
@@ -1734,19 +5253,41 @@
         },
         async getPath() {
             this.resource.listenOne = await getResourcePath(
-                "422139A2EF66EA888C5ED1D550AE23E0"
+                "BE415E5F4ACF889844A235A19832EB42"
             );
             this.resource.readingOne = await getResourcePath(
-                "3F442B682D84C8AB06C800B29D734920"
+                "CAA563DB7727326EF9469C71E198DC20"
             );
             this.resource.readingTwo = await getResourcePath(
-                "E8719EC88026BCFB11D292AA999F6D3D"
+                "E18F33A25DEB9B77CCBA5FC2977E3385"
+            );
+            this.resource.readingThree = await getResourcePath(
+                "6CC658238756D3B60721712FA2453082"
+            );
+
+            this.resource.readingFour = await getResourcePath(
+                "7E56A7028EFD4ECB1320DB02D079F2A2"
+            );
+
+            this.resource.listenTwo = await getResourcePath(
+                "E143D4F451EA8172C368005710C4692B"
+            );
+
+            this.resource.listenThree = await getResourcePath(
+                "E143D4F451EA8172C368005710C4692B"
+            );
+
+            this.resource.listenFour = await getResourcePath(
+                "B9FD8D144AB41BB9BFB7D363F0FD7975"
             );
         },
         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") {
@@ -1795,7 +5336,7 @@
             this.dropdownData = dropdownDatas;
         },
         changeDropdown() {
-            localStorage.removeItem("english-dropdown-one");
+            localStorage.removeItem("english-dropdown-three");
             for (let key in this.dropdownData) {
                 const item = this.dropdownData[key];
                 item.value = "";
@@ -1804,15 +5345,245 @@
         },
         setDropdownData() {
             localStorage.setItem(
-                "english-dropdown-one",
+                "english-dropdown-three",
                 JSON.stringify(this.dropdownData)
             );
         },
         saveData() {
             console.log(this.testData);
         },
-        audioPlay() {
-            this.$emit("closeMiniAudio");
+        isShowRight(answer, userAnswer, data) {
+            let flag = null;
+            if (userAnswer.indexOf(data) > -1) {
+                flag = answer.indexOf(data) > -1 ? true : false;
+            }
+            return flag;
+        },
+        // 璋冩暣棰樼洰鏁版嵁鍚�
+        // lietenOne
+        // 鎻愪氦
+        handelListenOneData() {
+            for (let index = 0; index < this.listenOne.length; index++) {
+                const item = this.listenOne[index]
+                item.isRight = item.value == item.answer
+                item.isComplete = true
+                item.isShowAnswer = true
+            }
+            console.log('鎻愪环', this.listenOne)
+            this.saveListenOneData()
+        },
+        // 淇濆瓨
+        saveListenOneData() {
+            localStorage.setItem('english-chapter03-listenOne', JSON.stringify(this.listenOne))
+        },
+        // 鏌ョ湅绛旀
+        viewListenOneData() {
+            for (let index = 0; index < this.listenOne.length; index++) {
+                const item = this.listenOne[index]
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        // 閲嶅仛
+        recastListenOneData() {
+            localStorage.removeItem('english-chapter03-listenOne')
+            for (let index = 0; index < this.listenOne.length; index++) {
+                const item = this.listenOne[index]
+                item.value = ''
+                item.isRight = null
+                item.isComplete = false
+            }
+        },
+        // 鍙渶瑕佷繚瀛樼殑棰樼洰鏁版嵁
+        // 淇濆瓨
+        saveNoSubmitData() {
+            localStorage.setItem('english-chapter03-noSubmitData', JSON.stringify(this.noSubmitData))
+        },
+        // 鏌ョ湅绛旀
+        viewNoSubmitData(num, number) {
+            this.noSubmitData[num].value[number].isShowAnswer = !this.noSubmitData[num].value[number].isShowAnswer
+        },
+        // wordsOne
+        // 淇濆瓨
+        savewordsOne() {
+            localStorage.setItem('english-chapter03-wordsOne', JSON.stringify(this.wordsOne))
+        },
+        // 閲嶅仛
+        recastwordsOne() {
+            localStorage.removeItem('english-chapter03-wordsOne')
+            for (let index = 0; index < this.wordsOne.length; index++) {
+                const item = this.wordsOne[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.userAnswer = '',
+                        citem.isRight = null
+                }
+            }
+        },
+        // 鏌ョ湅绛旀
+        viewwordsOne() {
+            for (let index = 0; index < this.wordsOne.length; index++) {
+                const item = this.wordsOne[index];
+                item.isShowAnswer = true
+            }
+        },
+        handelwordsOne() {
+            for (let index = 0; index < this.wordsOne.length; index++) {
+                const item = this.wordsOne[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
+                }
+            }
+        },
+        saveminiTable() {
+            console.log(1);
+            localStorage.setItem('english-chapter03-miniTable', JSON.stringify(this.miniTable))
+        },
+        saveListenTwo() {
+            localStorage.setItem('english-chapter03-listenTwo', JSON.stringify(this.listenTwo))
+        },
+        handelListenTwo() {
+            for (let index = 0; index < this.listenTwo.length; index++) {
+                const item = this.listenTwo[index];
+                item.isComplete = true
+                item.isShowAnswer = true
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.isRight = citem.answer == citem.userAnswer
+                }
+            }
+            this.saveListenTwo()
+        },
+        recastListenTwo() {
+            localStorage.removeItem('english-chapter03-listenTwo')
+            for (let index = 0; index < this.listenTwo.length; index++) {
+                const item = this.listenTwo[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.isRight = null
+                    if (Array.isArray(citem.userAnswer)) {
+                        citem.userAnswer = ["", ""]
+                    } else {
+                        citem.userAnswer = ""
+                    }
+                }
+            }
+
+        },
+        viewListenTwo() {
+            for (let index = 0; index < this.listenTwo.length; index++) {
+                const item = this.listenTwo[index];
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        saveMiniProjectTwo() {
+            localStorage.setItem('english-chapter03-miniProjectTwo', JSON.stringify(this.miniProjectTwo))
+        },
+        handelMiniProjectTwo() {
+            for (let index = 0; index < this.miniProjectTwo.length; index++) {
+                const item = this.miniProjectTwo[index];
+                item.isComplete = true
+                item.isShowAnswer = true
+            }
+            this.saveMiniProjectTwo()
+        },
+        recastMiniProjectTwo() {
+            for (let index = 0; index < this.miniProjectTwo.length; index++) {
+                const item = this.miniProjectTwo[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.userAnswer = []
+                }
+            }
+            localStorage.removeItem('english-chapter03-miniProjectTwo')
+        },
+        viewMiniProjectTwo() {
+            for (let index = 0; index < this.miniProjectTwo.length; index++) {
+                const item = this.miniProjectTwo[index];
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        saveListenThree() {
+            localStorage.setItem('english-chapter03-listenThree', JSON.stringify(this.listenThree))
+        },
+        handelListenThree() {
+            for (let index = 0; index < this.listenThree.length; index++) {
+                const item = this.listenThree[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.saveListenThree()
+        },
+        recastListenThree() {
+            for (let index = 0; index < this.listenThree.length; index++) {
+                const item = this.listenThree[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                for (let cindex = 0; cindex < item.value.length; cindex++) {
+                    const citem = item.value[cindex];
+                    citem.userAnswer = ''
+                }
+            }
+            localStorage.removeItem('english-chapter03-listenThree')
+        },
+        viewListenThree() {
+            for (let index = 0; index < this.listenThree.length; index++) {
+                const item = this.listenThree[index];
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        savePracticalWriting() {
+            localStorage.setItem('english-chapter03-practicalWriting', JSON.stringify(this.practicalWriting))
+        },
+        handlePracticalWriting() {
+            for (let index = 0; index < this.practicalWriting.length; index++) {
+                const item = this.practicalWriting[index];
+                item.isComplete = true
+                item.isShowAnswer = true
+                if (item.type == 'radio') {
+                    for (let cindex = 0; cindex < item.value.length; cindex++) {
+                        const citem = item.value[cindex];
+                        citem.isRight = citem.userAnswer == citem.answer
+                    }
+                }
+            }
+            this.savePracticalWriting()
+        },
+        recastPracticalWriting() {
+            for (let index = 0; index < this.practicalWriting.length; index++) {
+                const item = this.practicalWriting[index];
+                item.isComplete = false
+                item.isShowAnswer = false
+                if (item.type == 'radio') {
+                    for (let cindex = 0; cindex < item.value.length; cindex++) {
+                        const citem = item.value[cindex];
+                        citem.isRight = null,
+                            citem.userAnswer = ''
+                    }
+                }
+            }
+            localStorage.removeItem('english-chapter03-practicalWriting')
+        },
+        viewPracticalWriting() {
+            for (let index = 0; index < this.practicalWriting.length; index++) {
+                const item = this.practicalWriting[index];
+                item.isShowAnswer = !item.isShowAnswer
+            }
+        },
+        showNoSubmitAnswer(index,num) {
+            this.$set(this.noSubmitData[index].value[num],'isShowAnswer',!this.noSubmitData[index].value[num].isShowAnswer)
         },
     },
 };
@@ -1892,4 +5663,23 @@
     right: 0;
     background-color: red;
 }
-</style>
\ No newline at end of file
+
+.wating-email-box {
+    background-color: #e0eaf7;
+    border: 2px solid #95b8d3;
+    padding: 0 10px;
+
+    ul {
+        display: flex;
+        flex-wrap: wrap;
+
+        li {
+            white-space: nowrap;
+            margin-right: 20px;
+            width: 42%;
+            display: flex;
+            align-items: center;
+        }
+    }
+}
+</style>

--
Gitblit v1.9.1