From f7031597005a670b1d0feb435ceb1c13920cbfd2 Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期一, 22 七月 2024 19:57:40 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/books/English/view/components/chapter008.vue | 1358 +++++++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 1,010 insertions(+), 348 deletions(-) diff --git a/src/books/English/view/components/chapter008.vue b/src/books/English/view/components/chapter008.vue index a1a712d..2855c1c 100644 --- a/src/books/English/view/components/chapter008.vue +++ b/src/books/English/view/components/chapter008.vue @@ -41,36 +41,13 @@ </p> <p class="center"> 1. - <select class="select-border" v-model="dropdownData.one.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.one.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.one.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[0].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(0)" /> + <img :src="warmUp[0].value[0].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[0].isRight == true || warmUp[0].value[0].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歩ntercity train - </p> </div> <div class="right" style="width: 48%"> <div> @@ -79,36 +56,13 @@ </p> <p class="center"> 2. - <select class="select-border" v-model="dropdownData.two.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.two.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.two.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[1].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(1)" /> + <img :src="warmUp[0].value[1].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[1].isRight == true || warmUp[0].value[1].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歰nline shopping - </p> </div> </div> @@ -120,36 +74,14 @@ </p> <p class="center"> 3. - <select class="select-border" v-model="dropdownData.three.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.three.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.three.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[2].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(2)" /> + <img :src="warmUp[0].value[2].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[2].isRight == true || warmUp[0].value[2].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歟lectronic payment - </p> + </div> <div class="right" style="width: 48%"> <div> @@ -158,36 +90,14 @@ </p> <p class="center"> 4. - <select class="select-border" v-model="dropdownData.four.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.four.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.four.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[3].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(3)" /> + <img :src="warmUp[0].value[3].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[3].isRight == true || warmUp[0].value[3].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歴hared bike - </p> + </div> </div> @@ -199,36 +109,14 @@ </p> <p class="center"> 5. - <select class="select-border" v-model="dropdownData.five.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.five.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.five.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[4].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(4)" /> + <img :src="warmUp[0].value[4].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[4].isRight == true || warmUp[0].value[4].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歵ake-away service - </p> + </div> <div class="right" style="width: 48%"> <div> @@ -237,42 +125,40 @@ </p> <p class="center"> 6. - <select class="select-border" v-model="dropdownData.six.value" - @change="setDropdownData" :disabled="dropdownData.isComplete"> - <option v-for="(item, index) in dropDownList" :key="index" - :value="item"> - {{ item }} - </option> - </select> - <span class="icon-box"> - <svg v-if="dropdownData.six.isRight" t="1716986419862" class="icon" - viewBox="0 0 1820 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="18767" - xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20"> - <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="dropdownData.six.isRight == false" t="1716987085767" - class="icon" viewBox="0 0 1024 1024" version="1.1" - xmlns="http://www.w3.org/2000/svg" p-id="25745" - xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> - <path - d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" - fill="#d81e06" p-id="25746"></path> - </svg> - </span> + <input type="text" class="input-bottom-border w50" + v-model="warmUp[0].value[5].userAnswer" @input="setWarmUp" + @blur="handleWarmUp(5)" /> + <img :src="warmUp[0].value[5].isRight ? correctIcon : errorIcon" + v-if="warmUp[0].value[5].isRight == true || warmUp[0].value[5].isRight == false"> </p> </div> - <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive"> - 绛旀锛歠acial recognition - </p> + </div> </div> </div> - <p><b>鈪�.What other jobs can you list?</b></p> - <p>____________________________________________</p> + <p><b>鈪�.What other jobs can you list?</b> + <span class="btn-box" @click="showAnswerOne = !showAnswerOne"> + <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" + viewBox="0 0 20.501 20.501"> + <path class="a" + d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z" + transform="translate(-3327.144 15329)" /> + </svg> + </span> + </p> + <p> + <textarea v-model="questionData.reading.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="6" + style=" width: 92%" class="fz-16 fm-son" @change="setBookQuestion"> + </textarea> + </p> + <div class="show-answer-box" v-if="showAnswerOne"> + <div>绛旀:</div> + <div> + <img src="../../assets/images/M8WarmUp.png" alt="" class="w100" /> + </div> + </div> </div> + </div> <div class="preface-bottom"> <span class="contet-num-box">136</span> @@ -294,10 +180,22 @@ <!-- 鍐呭 --> <div class="padding-93"> <div class="bodystyle"> - <h3 id="c065"><span class="bjh3">Listening</span></h3> - <p class="center"> <audio :src="resource.listenOne" controls - controlslist="noplaybackrate nodownload" class="audio" ></audio></p> - <p><b>Watch the video and find out how the speakers describe their jobs.</b></p> + <h3 id="c065" 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 find out how the speakers describe their jobs.</b> + <span class="btn-box" @click="showAnswerTwo = !showAnswerTwo"> + <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" + viewBox="0 0 20.501 20.501"> + <path class="a" + 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> <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14"> <tr class="table-th-bc"> <td class="tl-cn">Who is he/she?</td> @@ -355,13 +253,60 @@ </td> </tr> </table> + <div class="show-answer-box" v-if="showAnswerTwo"> + <div>绛旀:</div> + <div> + <img src="../../assets/images/M8ListeningOne.png" alt="" class="w100" /> + </div> + </div> <h3 id="c066"><span class="bjh3">Reading</span></h3> <p>1.There is a saying that a part-time job can be a way to gain the experience necessary for - full-time employment.Do you agree? Why or why not?</p> - <p>2.If you鈥檙e considering a part-time job,what鈥檚 your expectation of it?</p> - <p class="center">__________________</p> + full-time employment.Do you agree? Why or why not? + <span class="btn-box" @click="showAnswerThree = !showAnswerThree"> + <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" + viewBox="0 0 20.501 20.501"> + <path class="a" + d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z" + transform="translate(-3327.144 15329)" /> + </svg> + </span> + </p> + <p> + <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6" + style=" width: 92%" class="fz-16 fm-son" @change="setBookQuestion"> + </textarea> + </p> + <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerThree"> + 绛旀锛�(1).Gain confidence and responsibility (2).Explore alternate career options (3).Strengthen resume + (4).Develop work ethic skills (5).Create opportunities for socializing (6).Enhance communication skills + (7).Build networking opportunities (8).Gain independence (9).Get a stable cash flow (10).Learn money management skills + </p> + <p>2.If you鈥檙e considering a part-time job,what鈥檚 your expectation of it? + <span class="btn-box" @click="showAnswerFour = !showAnswerFour"> + <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" + viewBox="0 0 20.501 20.501"> + <path class="a" + d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z" + transform="translate(-3327.144 15329)" /> + </svg> + </span> + </p> + <p> + <textarea v-model="questionData.reading.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="6" + style=" width: 92%" class="fz-16 fm-son" @change="setBookQuestion"> + </textarea> + </p> + <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour"> + 绛旀锛�(1).a good salary (2).a regular working time (3).a friendly working team + (4).comfortable working environment + + </p> + <p class="center"> + <input type="text" class="input-bottom-border input-bc-t " style="width: 30%;" + v-model="questionData.reading.four" @change="setBookQuestion" /> + </p> <p class="center"> <audio :src="resource.listenOne" controls - controlslist="noplaybackrate nodownload" class="audio" ></audio></p> + controlslist="noplaybackrate nodownload" class="audio"></audio></p> <p>Everyone鈥檚 first job is special.There are a couple of reasons for this:the experience is burned into one鈥檚 memory; it gives you the practice needed to <span class="word-bc" @click="saveWord($event, 'fulfill')">fulfill</span> @@ -437,9 +382,9 @@ <span class="zt-cs" style="font-size: 20px">Words & Expressions</span> <span class="line-border-box"></span> </p> - <p class="center"><audio :src="resource.readingTwo" controls - controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio" - ></audio></p> + <p><audio :src="resource.readingTwo" controls + controlslist="noplaybackrate nodownload" style="margin-left: 10px" + class="audio"></audio></p> <p>fulfill /f蕣l藞f瑟l/ <i>v.</i> 绗﹀悎锛涘饱琛�</p> <div class="bkbj"> <p><i>to do or have what is required or necessary</i></p> @@ -742,120 +687,120 @@ </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.five" + <textarea v-model="noSubmitTwo[0].value[0].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.six" + <textarea v-model="noSubmitTwo[0].value[1].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.seven" - class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea> + <textarea v-model="noSubmitTwo[0].value[2].userAnswer" + class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.eight" + <textarea v-model="noSubmitTwo[0].value[3].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.nine" + <textarea v-model="noSubmitTwo[0].value[4].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.ten" + <textarea v-model="noSubmitTwo[0].value[5].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.eleven" + <textarea v-model="noSubmitTwo[0].value[6].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twelve" + <textarea v-model="noSubmitTwo[0].value[7].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.thirteen" + <textarea v-model="noSubmitTwo[0].value[8].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.fourteen" + <textarea v-model="noSubmitTwo[0].value[9].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.fifteen" + <textarea v-model="noSubmitTwo[0].value[10].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.sixteen" + <textarea v-model="noSubmitTwo[0].value[11].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.seventeen" + <textarea v-model="noSubmitTwo[0].value[12].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.eighteen" + <textarea v-model="noSubmitTwo[0].value[13].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.nineteen" + <textarea v-model="noSubmitTwo[0].value[14].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.twenty" + <textarea v-model="noSubmitTwo[0].value[15].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyOne" + <textarea v-model="noSubmitTwo[0].value[16].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyTwo" + <textarea v-model="noSubmitTwo[0].value[17].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyThree" + <textarea v-model="noSubmitTwo[0].value[18].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyFour" + <textarea v-model="noSubmitTwo[0].value[19].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyFive" + <textarea v-model="noSubmitTwo[0].value[20].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> </table> @@ -1056,12 +1001,45 @@ <div class="bodystyle"> <h2 id="b030"><img class="img-0" alt="" src="../../assets/images/dy8-le2.jpg" /></h2> <h3 id="c068"><span class="bjh3">Warm-up</span></h3> - <p><b>Mostly,the first step to map out your career is to create a career road map for + <p> + <b>Mostly,the first step to map out your career is to create a career road map for yourself.Work with your partner and figure out what the pictures in the following road - maps possibly mean,and then choose the proper expressions to fill in the blanks.</b></p> + maps possibly mean,and then choose the proper expressions to fill in the blanks. + </b> + <span class="btn-box" @click="showDropTwo(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> <p><b>Road map</b>1锛�</p> <p><b>People often think that career path works like this:</b></p> - <p class="center"><img class="img-a" alt="" src="../../assets/images/0153-1.jpg" /></p> + <ul class="fl"> + <li> + <img class="img-a" alt="" src="../../assets/images/job-1.jpg" /> + </li> + <li class="fl de-cl"> + <div style="height:50%;padding-left:25px" class="fl de-cl ju-ev"> + <div v-for="(item,index) in dropTwo[0].value" :key="index"> + <select v-model="item.userAnswer" @change="handleDropTwo(0,index)" style="width:200px;height:35px" + > + <option v-for="(citem, cindex) in dropTwo[0].option" :key="'change' + cindex" :value="citem"> + {{ citem}} + </option> + </select> + <img :src="item.isRight ? correctIcon : errorIcon" v-if="item.isRight == true || item.isRight == false"> + </div> + </div> + <div> + <img class="img-a" alt="" src="../../assets/images/job-2.jpg" /> + </div> + </li> + </ul> + <!-- <p class="center"> + <img class="img-a" alt="" src="../../assets/images/0153-1.jpg" /> + </p> --> </div> </div> <div class="preface-bottom"> @@ -1086,16 +1064,67 @@ <div class="bodystyle"> <p><b>Road map</b>2锛�</p> <p><b>In reality,it looks more like:</b></p> - <p class="center"><img class="img-a" alt="" src="../../assets/images/0154-1.jpg" /></p> - <h3 id="c069"><span class="bjh3">Reading</span></h3> - <p>1.Working hard is only the first part of success.Making good choices is the second part.It - truly takes both to achieve success at whatever you do.What鈥檚 your interpretation of the - sentence?</p> - <p>2.What鈥檚 your suggestion for making the 鈥渞ight鈥� career choice?</p> + <div class="center po-re " > + <img class="img-a" alt="" src="../../assets/images/0154-1.jpg" /> + <div class="reality-one"> + <select v-model="dropTwo[1].value[0].userAnswer" @change="handleDropTwo(1,0)" + > + <option v-for="(citem, cindex) in dropTwo[1].option" :key="'change' + cindex" :value="citem"> + {{ citem}} + </option> + </select> + <img :src="dropTwo[1].value[0].isRight ? correctIcon : errorIcon" v-if="dropTwo[1].value[0].isRight == true || dropTwo[1].value[0].isRight == false"> + </div> + <div class="reality-two"> + <select v-model="dropTwo[1].value[1].userAnswer" @change="handleDropTwo(1,1)" style="width:120px;height:35px" + > + <option v-for="(citem, cindex) in dropTwo[1].option" :key="'change' + cindex" :value="citem"> + {{ citem}} + </option> + </select> + <img :src="dropTwo[1].value[1].isRight ? correctIcon : errorIcon" v-if="dropTwo[1].value[1].isRight == true || dropTwo[1].value[1].isRight == false"> + </div> + <div class="reality-three"> + <select v-model="dropTwo[1].value[2].userAnswer" @change="handleDropTwo(1,2)" style="width:120px;height:35px" + > + <option v-for="(citem, cindex) in dropTwo[1].option" :key="'change' + cindex" :value="citem"> + {{ citem}} + </option> + </select> + <img :src="dropTwo[1].value[2].isRight ? correctIcon : errorIcon" v-if="dropTwo[1].value[2].isRight == true || dropTwo[1].value[2].isRight == false"> + </div> + </div> + + <h3 id="c069" class="fl al-cn"> + <span class="bjh3">Reading</span> + <audio :src="resource.listenTwo" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + </h3> + <ul> + <li v-for="(item,index) in noSubmitTwo[1].value" :key="index"> + <p> + {{index + 1}}.{{item.stem}} + <span class="btn-box" @click="showNoSubmitTWo(1,index)"> + <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="item.userAnswer" class="w100" @input="saveNoSubmitTWo"></textarea> + <div class="event-header-text-bc pd-5 w100 mt-20" + v-if="item.isShowAnswer"> + <span>绛旀锛�</span> + <span v-for="(citem,cindex) in item.answer" :key="cindex" class="mr-20"> + {{ citem }} + </span> + </div> + </li> + </ul> <p class="center"><b>Choose a Career You Love</b></p> <p class="center"><audio :src="resource.readingTwo" controls - controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio" - ></audio></p> + controlslist="noplaybackrate nodownload" style="margin-left: 10px" + class="audio"></audio></p> <p>We spend a large <span class="word-bc" @click="saveWord($event, 'portion')">portion</span> of our lives working,so how we spend those years matters.It is @@ -1177,7 +1206,7 @@ <span class="line-border-box"></span> </p> <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" - style="margin-left: 10px" class="audio" ></audio> + style="margin-left: 10px" class="audio"></audio> <p>portion /藞p蓴藧蕛n/ <i>n.</i>閮ㄥ垎</p> <div class="bkbj"> <p><i>one part of sth.larger</i></p> @@ -1279,38 +1308,42 @@ <p><b>鈪�.Reading comprehension.</b></p> <p>A.Mark the suggestions given by the author when choosing a career.</p> <p>Deciding on a Career拢Income</p> - <p>鈻ducation</p> - <p>鈻xperience</p> - <p>鈻oals</p> - <p>鈻appiness</p> - <p>鈻nterest</p> - <p>鈻atisfaction</p> - <p>鈻kills</p> - <p>鈻alues</p> + <p v-for="(item,index) in listenTwo[0].option" :key="index"> + <input type="checkbox" :value="item" name="what" v-model="listenTwo[0].value[0].userAnswer" :disabled="listenTwo[0].isComplete" :change="saveListenTwo"> + {{item}} + <img :src="isShowRight(listenTwo[0].answer,listenTwo[0].value[0].userAnswer,item) ? correctIcon : errorIcon" v-if="listenTwo[0].isComplete"> + </p> <p>B.Decide whether the following statements are true (T) or false (F).</p> - <p>(銆�) 1.When we decide on our future career,satisfaction and happiness matter a lot.</p> - <p>(銆�) 2.Positive emotions make us more productive and satisfied in our jobs.</p> - <p>(銆�) 3.Our past experiences have nothing to do with our jobs in the future.</p> - <p>(銆�) 4.There is no need to worry about what career we are going to take.</p> - <p>(銆�) 5.Luxuries will bring enjoyment to us,but that feeling cannot last forever.</p> + <p v-for="(item,index) in listenTwo[1].value" :key=" 'dropdown' + index"> + ( + <select v-model="item.userAnswer" class="select-border" @change="saveListenTwo"> + <option v-for="(citem, cindex) in listenTwo[1].option" :key="cindex" + :value="citem"> + {{ citem }} + </option> + </select> + ) + {{index + 1}}.{{item.stem}} + <img :src="item.isRight ? correctIcon : errorIcon" v-if="listenTwo[1].isComplete"> + </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.Once you find a desired <i>occupation</i>,you鈥檒l notice a change even in your daily - life._____________</p> - <p>2.Only a small <i>part</i> of the budget is spent on books._____________</p> - <p>3.Happiness itself can help to shape job market <i>results</i> and even firm - performance._____________</p> - <p>4.Those who are <i>excited</i> about numbers can work in the accounting field._____________ + <p v-for="(item,index) in listenTwo[2].value" :key="'Language' + index"> + {{index + 1}}.{{item.stem}} + <input type="text" :disabled="listenTwo[2].isComplete" v-model="item.userAnswer" class="input-bottom-border input-bc-t" @input="saveListenTwo" style="width:80px"> + <img :src="item.isRight ? correctIcon : errorIcon" v-if="listenTwo[2].isComplete"> </p> - <p>5.We need to leave our <i>pleasant</i> zone at work if we want growth - opportunities._____________</p> <p>B.Fill in the blanks with the proper form of the expressions given below.</p> <div class="bk-wh"> <p>a portion of銆�fall into place銆�be passionate about銆�later on be銆�comfortable with</p> </div> - <p>1.Keep your options open and everything will___________.</p> - <p>2.You鈥檇 better set a long-term goal that you can___________.</p> + <p v-for="(item,index) in listenTwo[3].value.slice(0,2)" :key="'Languages' + index"> + {{index + 1}}.{{item.stemOne}} + <input type="text" :disabled="listenTwo[3].isComplete" v-model="item.userAnswer" class="input-bottom-border input-bc-t" @input="saveListenTwo" style="width:80px"> + <img :src="item.isRight ? correctIcon : errorIcon" v-if="listenTwo[3].isComplete"> + {{item.stemTwo}} + </p> </div> </div> <div class="preface-bottom"> @@ -1333,9 +1366,12 @@ <!-- 鍐呭 --> <div class="padding-93"> <div class="bodystyle"> - <p>3.Anyone hired into the company must___________the system.</p> - <p>4.You must accept___________the blame for this crisis.</p> - <p>5.Many people plan to take one job of any kind and consider a new career path___________.</p> + <p v-for="(item,index) in listenTwo[3].value.slice(2,5)" :key="'Languages' + index"> + {{index + 3}}.{{item.stemOne}} + <input type="text" :disabled="listenTwo[3].isComplete" v-model="item.userAnswer" class="input-bottom-border input-bc-t" @input="saveListenTwo" style="width:80px"> + <img :src="item.isRight ? correctIcon : errorIcon" v-if="listenTwo[3].isComplete"> + {{item.stemTwo}} + </p> <p><b>鈪�.Grammar focus:Pronouns (it,one).</b><span class="btn-box" @click="showAnswer('showImgOne')"> <svg t="1717037443722" class="icon" viewBox="0 0 1024 1024" version="1.1" @@ -1358,16 +1394,31 @@ <p>2.Having a career that we are passionate about,<i>one</i> that gives our life a sense of purpose,and one that we are comfortable with is important.</p> </div> - <p>1.Although finding a new job might not be easy,there are many different methods to - find_______effectively.</p> - <p>2.As you make a decision about your career,_______is important to reflect on your - interest,skills and career goals.</p> - <p>3.People will usually set a milestone in their career path,_______that they will work for in - the next five or ten years.</p> - <p>4.A career aptitude test could be helpful,because_______will give you suggestions based on - the test of your personal type.</p> - <p>5.We all have to work,and for most of us,if you discount weekends and sleep,_______will take - up at least half our available time.</p> + <p v-for="(item,index) in listenTwo[4].value" :key="'Languagese' + index"> + {{index + 1}}.{{item.stemOne}} + <input type="text" :disabled="listenTwo[4].isComplete" v-model="item.userAnswer" class="input-bottom-border input-bc-t" @input="saveListenTwo" style="width:80px"> + <img :src="item.isRight ? correctIcon : errorIcon" v-if="listenTwo[4].isComplete"> + {{item.stemTwo}} + </p> + <div class="w100 fl ju-cn"> + <ul class="fl ju-ev" style="width:80%"> + <li> + <button class="btn-border btn-w" @click="handleListenTwo"> + 鎻愪氦 + </button> + </li> + <li> + <button @click="recastListenTwo" class="btn-border btn-w"> + 閲嶅仛 + </button> + </li> + <li> + <button @click="viewListenTwo" class="parimary-btn"> + 鏌ョ湅绛旀 + </button> + </li> + </ul> + </div> <h3 id="c070"><span class="bjh3">Mini-project</span></h3> <p>Work in groups.Every one of you will take a job in the future.Ask your group members what job he/she is going to choose and why he/she chooses this job.Jot down some notes,and prepare a @@ -1411,49 +1462,49 @@ </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.twentySix" + <textarea v-model="noSubmitTwo[2].value[0].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentySeven" - class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea> + <textarea v-model="noSubmitTwo[2].value[1].userAnswer" + class="w100 table-tr-bc b0 table-textarea" @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyEight" + <textarea v-model="noSubmitTwo[2].value[2].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.twentyNine" + <textarea v-model="noSubmitTwo[2].value[3].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.thirty" + <textarea v-model="noSubmitTwo[2].value[4].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.thirtyOne" + <textarea v-model="noSubmitTwo[2].value[5].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> <tr class="table-tr-bc"> <td class="tl-cn"> - <textarea v-model="questionData.table.thirtyTwo" + <textarea v-model="noSubmitTwo[2].value[6].userAnswer" class="w100 table-tr-bc b0 table-textarea textarea-box" - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> <td class="tl-cn"> - <textarea v-model="questionData.table.thirtyThree" + <textarea v-model="noSubmitTwo[2].value[7].userAnswer" class="w100 table-tr-bc b0 table-textarea " - @change="setBookQuestion"></textarea> + @input="saveNoSubmitTWo"></textarea> </td> </tr> </table> @@ -1607,8 +1658,8 @@ <h2 id="b031"><img class="img-0" alt="" src="../../assets/images/dy8-le3.jpg" /></h2> <h3 id="c071"><span class="bjh3">Listening</span></h3> <p class="center"> <audio :src="resource.readingTwo" controls - controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio" - ></audio></p> + controlslist="noplaybackrate nodownload" style="margin-left: 10px" + class="audio"></audio></p> <p><b>鈪�.Derek is talking about his job interview.Listen to the recording and fill in the blanks with what you hear.</b></p> <p>Hi,everyone.I鈥檓 Derek Cruise.I landed a job interview the other day.It is a bank @@ -1946,11 +1997,11 @@ <p><b>Role 1:Interviewer</b></p> <p>1.Work with your partner and decide what questions you will ask during the interview.2.Complete the worksheet for the interviewer.</p> - <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" - <p class="center"></p> - <p><b>Role 2:Interviewee</b></p> - <p>1.Make a list of the information which might be useful in the interview.2.Finish the - follow-up email after the interview.</p> + <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" <p + class="center"></p> + <p><b>Role 2:Interviewee</b></p> + <p>1.Make a list of the information which might be useful in the interview.2.Finish the + follow-up email after the interview.</p> </div> </div> <div class="preface-bottom"> @@ -2245,18 +2296,187 @@ }, data() { return { - warmUp:[ + warmUp: [ { + type: "fill", + isShowAnswer: false, + value: [ + { + answer: 'fitness coach', + userAnswer: '', + isRight: null + }, + { + answer: 'courier', + userAnswer: '', + isRight: null + }, + { + answer: 'flight attendant', + userAnswer: '', + isRight: null + }, + { + answer: 'sales representative', + userAnswer: '', + isRight: null + }, + { + answer: 'cyberathlete', + userAnswer: '', + isRight: null + }, + { + answer: 'machinist', + userAnswer: '', + isRight: null + }, + ] + }, + ], + questionDataOn:[ + { + type:"fill", isComplete:false, isShowAnswer:false, - - - } + value:[ + { + stem:"What job did the author take?", + answer:"Pulling out weeds", + userAnswer:"", + }, + { + stem:"How did he describe his job?", + answer:"Tedious", + userAnswer:"", + }, + { + stem:"What can be a proper title for this passage?", + answer:"My first job", + userAnswer:"", + }, + ] + }, + { + type:"fill", + isComplete:false, + isShowAnswer:false, + value:[ + { + userAnswer:"", + }, + { + userAnswer:"", + }, + { + userAnswer:"", + }, + { + userAnswer:"", + }, + { + userAnswer:"", + }, + ] + }, + { + type:"fill", + isComplete:false, + isShowAnswer:false, + value:[ + { + answer:"I wanted to buy a new speed cube, but I did not have any money, and my parents would not give me the money.", + userAnswer:"", + }, + { + answer:"The experience is burned in one's memory, it gives you the practice needed to fulfill other positions, and it teaches you about the value of money.", + userAnswer:"", + }, + { + answer:"The experience hardened my spirits and resolve and supplied me with the value of money.", + userAnswer:"", + }, + { + answer:"I went to Mrs. Hudson, and asked her for the work to tend her garden.", + userAnswer:"", + }, + { + answer:"My first job was to pull out weeds.", + userAnswer:"", + }, + ] + }, + { + type:"fill", + isComplete:false, + isShowAnswer:false, + value:[ + { + answer:"couple", + userAnswer:"", + }, + { + answer:"elderly", + userAnswer:"", + }, + { + answer:"neighborhood", + userAnswer:"", + }, + { + answer:"tedious", + userAnswer:"", + }, + { + answer:"value", + userAnswer:"", + }, + { + answer:"sweat", + userAnswer:"", + }, + ] + }, + { + type:"fill", + isComplete:false, + isShowAnswer:false, + value:[ + { + answer:"couple", + userAnswer:"", + }, + { + answer:"elderly", + userAnswer:"", + }, + { + answer:"neighborhood", + userAnswer:"", + }, + { + answer:"tedious", + userAnswer:"", + }, + { + answer:"value", + userAnswer:"", + }, + { + answer:"sweat", + userAnswer:"", + }, + ] + }, ], + showAnswerOne: false, + showAnswerTwo: false, + showAnswerThree: false, + showAnswerFour: false, imgThirteen: require("../../assets/images/grammar8-1.png"), imgThirteenOne: require("../../assets/images/grammar8-2.png"), - correctIcon:require('@/assets/images/correct.svg'), - errorIcon:require('@/assets/images/error.svg'), + correctIcon: require('@/assets/images/correct.svg'), + errorIcon: require('@/assets/images/error.svg'), showImg: false, showImgOne: false, rawData: { @@ -2378,42 +2598,17 @@ answerImg: require("../../assets/images/matching-one.png"), }, questionData: { - warnUp: { - one: { - value: "", - isRight: null, - answer: "Chinese knot", - }, - two: { - value: "", - isRight: null, - answer: "Chinese medicine", - }, - three: { - value: "", - isRight: null, - answer: "Chinese calligraphy", - }, - four: { - value: "", - isRight: null, - answer: "Taichi", - }, - five: { - value: "", - isRight: null, - answer: "sweet dumpling", - }, - six: { - value: "", - isRight: null, - answer: "Chinese chess", - }, - seven: "", - }, reading: { one: "", two: "", + three: "", + four: "", + five: "", + six: "", + seven: "", + eight: "", + nine: "", + ten: "", }, table: { one: "", @@ -2513,7 +2708,8 @@ listenOne: "", readingOne: "", readingTwo: "", - videoPathOne:'' + videoPathOne:'', + listenTwo:'' }, dropdownData: { one: { @@ -2550,10 +2746,10 @@ listenThree:[ { - type:"fill", - isComplete:false, - isShowAnswer:false, - value:[ + type: "fill", + isComplete: false, + isShowAnswer: false, + value: [ { answer:'clerk', userAnswer:'', @@ -2788,16 +2984,406 @@ ] }, ], - + noSubmitTwo:[ + { + type:'table', + value:[ + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + { + userAnswer:'', + }, + ] + }, + { + type:'shortAnswer', + value:[ + { + stem:'.Working hard is only the first part of success.Making good choices is the second part.It truly takes both to achieve success at whatever you do.What鈥檚 your interpretation of the sentence?', + answer:[ + 'In order to be happy, you need to love what you are doing in life. Choosing a career, here, plays an important role in determining the level of your achievements. If you land down with a career that does not suit your qualification and potential, then you will only be wasting your time and energy into something which is neither good for your career nor your life. Selecting a wrong career will hold you in an inappropriate situation which will not only affect your professional life but will have an adverse impact on your personal life too.' + ], + userAnswer:'', + isShowAnswer:false + }, + { + stem:'What鈥檚 your suggestion for making the 鈥渞ight鈥� career choice?', + answer:[ + '1) Be aware of how other factors influence you', + '2) Never forget your strengths', + '3) Volunteer in your possible professions', + '4) Consider how you want your career to support you financially ', + '5) Take your time 鈥� don鈥檛 feel like you have to rush the process', + '6) Be patient with yourself, and keep in mind this is a challenging task', + '7) Reflect on what subjects in high school you enjoyed', + '8) Think about your dreams in life but try to understand why' + ], + userAnswer:'', + isShowAnswer:false + }, + ] + }, + { + type:'table', + value:[ + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + { + userAnswer:'' + }, + ] + } + ], + dropTwo:[ + { + type:'dropdown', + isShowAnswer:false, + option:[ + 'identify passion','go to school' + ], + value:[ + { + answer:'identify passion', + userAnswer:'' + }, + { + answer:'go to school', + userAnswer:'' + }, + ] + }, + { + type:'dropdown', + isComplete:false, + option:[ + 'change your mind', + 'get another job', + 'focus on one' + ], + value:[ + { + answer:'focus on one', + userAnswer:'' + }, + { + answer:'change your mind', + userAnswer:'' + }, + { + answer:'get another job', + userAnswer:'' + }, + ] + } + ], + listenTwo:[ + { + type:'checkbox', + isComplete:false, + isShowAnswer:false, + answer:['Experience','Happiness','Income','Satisfaction'], + option:[ + 'Education','Experience','Goals','Happiness','Interest','Satisfaction','Skills','Values' + ], + value:[ + { + userAnswer:[] + } + ] + }, + { + type:"dropdown", + isComplete:false, + isShowAnswer:false, + option:['T','F'], + value:[ + { + stem:'When we decide on our future career,satisfaction and happiness matter a lot.', + answer:'T', + userAnswer:'', + isRight:null, + }, + { + stem:'Positive emotions make us more productive and satisfied in our jobs.', + answer:'T', + userAnswer:'', + isRight:null, + }, + { + stem:'Our past experiences have nothing to do with our jobs in the future.', + answer:'F', + userAnswer:'', + isRight:null, + }, + { + stem:'Our past experiences have nothing to do with our jobs in the future.', + answer:'F', + userAnswer:'', + isRight:null, + }, + { + stem:'Luxuries will bring enjoyment to us,but that feeling cannot last forever.', + answer:'T', + userAnswer:'', + isRight:null, + }, + ] + }, + { + type:'fill', + isComplete:false, + isShowAnswer:false, + value:[ + { + stem:'Once you find a desired occupation,you鈥檒l notice a change even in your daily life.', + answer:'career', + userAnswer:'', + isRight:null, + }, + { + stem:'Only a small part of the budget is spent on books.', + answer:'beneficial', + userAnswer:'', + isRight:null, + }, + { + stem:'Happiness itself can help to shape job market results and even firm performance.', + answer:'outcomes', + userAnswer:'', + isRight:null, + }, + { + stem:'Those who are excited about numbers can work in the accounting field.', + answer:'passionate', + userAnswer:'', + isRight:null, + }, + { + stem:'We need to leave our pleasant zone at work if we want growth opportunities.', + answer:'comfortable', + userAnswer:'', + isRight:null, + }, + ] + }, + { + type:'fill', + isComplete:false, + isShowAnswer:false, + value:[ + { + + stemOne:'Keep your options open and everything will', + stemTwo:'.', + answer:'fall into place', + userAnswer:'', + isRight:null + }, + { + + stemOne:'You鈥檇 better set a long-term goal that you can', + stemTwo:'.', + answer:'be passionate about', + userAnswer:'', + isRight:null + }, + { + + stemOne:'Anyone hired into the company must', + stemTwo:'the system.', + answer:'be comfortable with', + userAnswer:'', + isRight:null + }, + { + + stemOne:'You must accept', + stemTwo:'the blame for this crisis.', + answer:'a portion of', + userAnswer:'', + isRight:null + }, + { + + stemOne:'the blame for this crisis.', + stemTwo:'.', + answer:'later on', + userAnswer:'', + isRight:null + }, + ] + }, + { + type:'fill', + isComplete:false, + isShowAnswer:false, + value:[ + { + + stemOne:'Although finding a new job might not be easy,there are many different methods to find', + stemTwo:'effectively.', + answer:'one', + userAnswer:'', + isRight:null + }, + { + + stemOne:'As you make a decision about your career,', + stemTwo:'is important to reflect on your interest,skills and career goals.', + answer:'it', + userAnswer:'', + isRight:null + }, + { + + stemOne:'People will usually set a milestone in their career path,', + stemTwo:'that they will work for in the next five or ten years.', + answer:'one', + userAnswer:'', + isRight:null + }, + { + + stemOne:'A career aptitude test could be helpful,because', + stemTwo:'will give you suggestions based on the test of your personal type.', + answer:'it', + userAnswer:'', + isRight:null + }, + { + + stemOne:'We all have to work,and for most of us,if you discount weekends and sleep,', + stemTwo:'will take up at least half our available time.', + answer:'it', + userAnswer:'', + isRight:null + }, + ] + }, + ] }; }, mounted() { + const warmUp = localStorage.getItem("english-chapter-8-warmUp"); + if (warmUp) { + this.warmUp = JSON.parse(warmUp); + } + const bookQuestion = localStorage.getItem("english-book-chapter08-question-one"); + if (bookQuestion) { + this.questionData = JSON.parse(bookQuestion); + } this.getPath(); - }, + const listenThree = localStorage.getItem('english-chapter08-listenThree') + if(listenThree) this.listenThree = JSON.parse(listenThree) + const noSubmitThree = localStorage.getItem('english-chapter08-noSubmitThree') + if(noSubmitThree) this.noSubmitThree = JSON.parse(noSubmitThree) + const practicalThree = localStorage.getItem('english-chapter08-practicalThree') + if(practicalThree) this.practicalThree = JSON.parse(practicalThree) + const noSubmitTwo = localStorage.getItem('english-chapter08-noSubmitTwo') + if(noSubmitTwo) this.noSubmitTwo = JSON.parse(noSubmitTwo) + const dropTwo = localStorage.getItem('english-chapter08-dropTwo') + if(dropTwo) this.dropTwo = JSON.parse(dropTwo) + const listenTwo = localStorage.getItem('english-chapter08-listenTwo') + if(listenTwo) this.listenTwo = JSON.parse(listenTwo) + }, methods: { + handleWarmUp(type) { + if (this.warmUp[0].value[type].userAnswer.trim()) { + this.warmUp[0].value[type].isRight = this.warmUp[0].value[type].userAnswer.trim() == this.warmUp[0].value[type].answer + } else { + this.warmUp[0].value[type].isRight = null + } + this.setWarmUp(); + }, + setWarmUp() { + localStorage.setItem("english-chapter-8-warmUp", JSON.stringify(this.warmUp)); + }, + setBookQuestion() { + localStorage.setItem( + "english-book-chapter08-question-one", + JSON.stringify(this.questionData) + ); + }, arrayToString(data) { - if(Array.isArray(data)) { - return data.toString() + if (Array.isArray(data)) { + return data.toString() } else { return data } @@ -2826,12 +3412,6 @@ setTestData() { localStorage.setItem("english-testOne", JSON.stringify(this.testData)); }, - setBookQuestion() { - localStorage.setItem( - "english-book-question-one", - JSON.stringify(this.questionData) - ); - }, async getPath() { this.resource.listenOne = await getResourcePath( "422139A2EF66EA888C5ED1D550AE23E0" @@ -2841,6 +3421,9 @@ ); this.resource.readingTwo = await getResourcePath( "E8719EC88026BCFB11D292AA999F6D3D" + ); + this.resource.listenTwo = await getResourcePath( + "ADAFFAB7BC7A868574889809AB1166A6" ); this.resource.videoPathOne = await getResourcePath( "29A9C275EEF0BF71C52BE68D8842C0E4" @@ -2904,6 +3487,57 @@ }, showPracticalThree(index) { this.$set(this.practicalThree[index],'isShowAnswer',!this.practicalThree[index].isShowAnswer) + }, + saveNoSubmitTWo() { + localStorage.setItem('english-chapter08-noSubmitTwo',JSON.stringify(this.noSubmitTwo)) + }, + showNoSubmitTWo(index,num) { + this.$set(this.noSubmitTwo[index].value[num],'isShowAnswer',!this.noSubmitTwo[index].value[num].isShowAnswer) + }, + saveDropTwo() { + localStorage.setItem('english-chapter08-dropTwo',JSON.stringify(this.dropTwo)) + }, + handleDropTwo(index,num) { + this.$set(this.dropTwo[index].value[num],'isRight',this.dropTwo[index].value[num].userAnswer == this.dropTwo[index].value[num].answer) + this.saveDropTwo() + }, + saveListenTwo() { + localStorage.setItem('english-chapter08-listenTwo',JSON.stringify(this.listenTwo)) + }, + handleListenTwo() { + for (let index = 0; index < this.listenTwo.length; index++) { + const item = this.listenTwo[index]; + item.isComplete = true + item.isShowAnswer = true + if(item.type !== 'checkbox') { + for (let cindex = 0; cindex < item.value.length; cindex++) { + const citem = item.value[cindex]; + citem.isRight = citem.userAnswer == citem.answer + } + } + } + this.saveListenTwo() + }, + recastListenTwo() { + for (let index = 0; index < this.listenTwo.length; index++) { + const item = this.listenTwo[index]; + item.isComplete = false + item.isShowAnswer = false + if(item.type !== 'checkbox') { + for (let cindex = 0; cindex < item.value.length; cindex++) { + const citem = item.value[cindex]; + citem.isRight = null + citem.userAnswer = null + } + } + } + localStorage.removeItem('english-chapter08-listenTwo') + }, + viewListenTwo() { + for (let index = 0; index < this.listenTwo.length; index++) { + const item = this.listenTwo[index]; + item.isShowAnswer = !item.isShowAnswer + } } }, }; @@ -2996,4 +3630,32 @@ border:2px dashed #d1d2d4; border-radius:3%; } +.po-re { + position: relative; +} +.reality-one,.reality-two,.reality-three { + width:18%; + height:7%; + select { + width:100%; + height:100%; + } +} +.reality-one { + + position:absolute; + right: 30%; + top: 30%; + +} +.reality-two { + position:absolute; + right: 50%; + top: 47%; +} +.reality-three { + position:absolute; + right: 44%; + bottom: 6.5%; +} </style> \ No newline at end of file -- Gitblit v1.9.1