闫增涛
2024-06-25 39d1f60746dd617b1ab6cde9a48955ce2017b91e
Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout
3个文件已修改
36个文件已添加
6292 ■■■■ 已修改文件
src/books/English/assets/images/0020-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0025-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0026-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0027-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0028-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0029-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0030-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0031-3.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0034-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0035-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0041-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0044-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0044-2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0045-2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0046-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0048-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0049-2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0049-3.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0049-4.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0049-5.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0054-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0054-2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0055-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0055-2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0056-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0059-1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy1-le3.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy2-le1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy2-le2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy3-le1.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy3-le2.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy3-le3.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/dy3.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/main.less 54 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/chapter001.vue 2303 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/chapter002.vue 2008 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/chapter003.vue 1806 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/index.vue 121 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/0020-1.jpg
src/books/English/assets/images/0025-1.jpg
src/books/English/assets/images/0026-1.jpg
src/books/English/assets/images/0027-1.jpg
src/books/English/assets/images/0028-1.jpg
src/books/English/assets/images/0029-1.jpg
src/books/English/assets/images/0030-1.jpg
src/books/English/assets/images/0031-3.jpg
src/books/English/assets/images/0034-1.jpg
src/books/English/assets/images/0035-1.jpg
src/books/English/assets/images/0041-1.jpg
src/books/English/assets/images/0044-1.jpg
src/books/English/assets/images/0044-2.jpg
src/books/English/assets/images/0045-2.jpg
src/books/English/assets/images/0046-1.jpg
src/books/English/assets/images/0048-1.jpg
src/books/English/assets/images/0049-2.jpg
src/books/English/assets/images/0049-3.jpg
src/books/English/assets/images/0049-4.jpg
src/books/English/assets/images/0049-5.jpg
src/books/English/assets/images/0054-1.jpg
src/books/English/assets/images/0054-2.jpg
src/books/English/assets/images/0055-1.jpg
src/books/English/assets/images/0055-2.jpg
src/books/English/assets/images/0056-1.jpg
src/books/English/assets/images/0059-1.jpg
src/books/English/assets/images/dy1-le3.jpg
src/books/English/assets/images/dy2-le1.jpg
src/books/English/assets/images/dy2-le2.jpg
src/books/English/assets/images/dy2.jpg
src/books/English/assets/images/dy3-le1.jpg
src/books/English/assets/images/dy3-le2.jpg
src/books/English/assets/images/dy3-le3.jpg
src/books/English/assets/images/dy3.jpg
src/books/English/assets/main.less
@@ -755,6 +755,24 @@
  .event-text-color {
    color: #639bc2;
  }
  .event-header-bc-unit2 {
    background: linear-gradient(to right, #bc5a74, #fff);
  }
  .event-header-text-bc-unit2 {
    background-color: #f0d1c8;
  }
  .event-text-color-unit2 {
    color: #bc5a74;
  }
  .event-header-bc-unit3 {
    background: linear-gradient(to right, #3ab186, #fff);
  }
  .event-header-text-bc-unit3 {
    background-color: #cbe6d3;
  }
  .event-text-color-unit3 {
    color: #3ab186;
  }
  .y-bc {
    background-color: #f3e3c7;
  }
@@ -841,14 +859,41 @@
    .chapter-left-bc {
      background-color: #639bc2;
    }
    .chapter-left-bc-unit2 {
      background-color: #bc5a74;
    }
    .chapter-left-bc-unit3 {
      background-color: #3ab186;
    }
    .chapter-right-bc {
      background-color: #bbd4ec;
    }
    .chapter-right-bc-unit2 {
      background-color: #f0d1c8;
      padding-right: 10%;
    }
    .chapter-right-bc-unit3 {
      background-color: #cbe6d3;
      padding-right: 10%;
    }
    .chapter-right-cl {
      color: #639bc2;
    }
    .chapter-right-cl-unit2 {
      color: #bc5a74;
    }
    .chapter-right-cl-unit3 {
      color: #3ab186;
    }
  }
  .parimary-btn {
  .tl-w-45{
      width: 45%;
    }
    .mr-rg{
      margin-right: 0;
    }
    .parimary-btn {
    min-width: 80px;
    height: 30px;
    font-size: 14px;
@@ -906,6 +951,9 @@
  .tl-cn {
    text-align: center;
  }
  .tl-left{
    text-align: left;
  }
  .b0 {
    border: 0;
  }
@@ -955,6 +1003,10 @@
    word-break: break-all;
    resize: none;
  }
  .textarea-box-right{
    width: 500px;
    height: 36px;
  }
}
/* 媒体查询做基础响应式布局 */
@media (max-width: 660px) {
src/books/English/view/components/chapter001.vue
@@ -26,10 +26,7 @@
    <div class="page-box" page="8">
      <div v-if="showPageList.indexOf(8) > -1">
        <div class="w100 mb-20" style="padding-right: 20px">
          <div
            class="event-header-bc fl al-end"
            style="height: 100px; padding-left: 40px"
          >
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
@@ -43,22 +40,13 @@
            </h2>
            <h3 id="c001"><span class="bjh3">Warm-up</span></h3>
            <p>
              <b
                >Ⅰ.Write down the English words for the Chinese cultural symbols
                in the following pictures.</b
              >
              <b>Ⅰ.Write down the English words for the Chinese cultural symbols
                in the following pictures.</b>
              <span class="btn-box" @click="showAnswerTwo = !showAnswerTwo">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="20.501"
                  height="20.501"
                  viewBox="0 0 20.501 20.501"
                >
                  <path
                    class="a"
                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
                  <path class="a"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                    transform="translate(-3327.144 15329)" />
                </svg>
              </span>
            </p>
@@ -70,120 +58,57 @@
                      <img src="../../assets/images/0012-1.jpg" class="w100" />
                    </p>
                    <p class="center">
                      1.<input
                        v-model="questionData.warnUp.one.value"
                        class="input-bottom-border fz-18"
                        @blur="handleQuestion('one')"
                        @change="setBookQuestion"
                      />
                      1.<input v-model="questionData.warnUp.one.value" class="input-bottom-border fz-18"
                        @blur="handleQuestion('one')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.one.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.one.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.one.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.one.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:Chinese knot
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0012-2.jpg"
                        style="width: 94%"
                      />
                      <img src="../../assets/images/0012-2.jpg" style="width: 94%" />
                    </p>
                    <p class="center">
                      2.<input
                        class="input-bottom-border fz-18"
                        v-model="questionData.warnUp.two.value"
                        @blur="handleQuestion('two')"
                        @change="setBookQuestion"
                      />
                      2.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.two.value"
                        @blur="handleQuestion('two')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.two.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.two.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.two.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.two.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:Chinese medicine
                  </p>
                </div>
@@ -196,120 +121,57 @@
                      <img src="../../assets/images/0012-3.jpg" class="w100" />
                    </p>
                    <p class="center">
                      3.<input
                        class="input-bottom-border fz-18"
                        v-model="questionData.warnUp.three.value"
                        @blur="handleQuestion('three')"
                        @change="setBookQuestion"
                      />
                      3.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.three.value"
                        @blur="handleQuestion('three')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.three.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.three.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.three.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.three.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:Chinese calligraphy
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0012-4.jpg"
                        style="width: 93%"
                      />
                      <img src="../../assets/images/0012-4.jpg" style="width: 93%" />
                    </p>
                    <p class="center">
                      4.<input
                        class="input-bottom-border fz-18"
                        v-model="questionData.warnUp.four.value"
                        @blur="handleQuestion('four')"
                        @change="setBookQuestion"
                      />
                      4.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.four.value"
                        @blur="handleQuestion('four')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.four.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.four.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.four.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.four.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:Taichi
                  </p>
                </div>
@@ -322,120 +184,57 @@
                      <img src="../../assets/images/0012-5.jpg" class="w100" />
                    </p>
                    <p class="center">
                      5.<input
                        class="input-bottom-border fz-18"
                        v-model="questionData.warnUp.five.value"
                        @blur="handleQuestion('five')"
                        @change="setBookQuestion"
                      />
                      5.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.five.value"
                        @blur="handleQuestion('five')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.five.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.five.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.five.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.five.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:sweet dumpling
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0012-6.jpg"
                        style="width: 92%"
                      />
                      <img src="../../assets/images/0012-6.jpg" style="width: 92%" />
                    </p>
                    <p class="center">
                      6.<input
                        class="input-bottom-border fz-18"
                        v-model="questionData.warnUp.six.value"
                        @blur="handleQuestion('six')"
                        @change="setBookQuestion"
                      />
                      6.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.six.value"
                        @blur="handleQuestion('six')" @change="setBookQuestion" />
                      <span class="icon-box">
                        <svg
                          v-if="questionData.warnUp.six.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.six.isRight" t="1716986419862" class="icon"
                          viewBox="0 0 1820 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="questionData.warnUp.six.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="questionData.warnUp.six.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
                    答案:Chinese chess
                  </p>
                </div>
@@ -450,32 +249,17 @@
                显示答案
              </button> -->
              <span class="btn-box" @click="showAnswerOne = !showAnswerOne">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="20.501"
                  height="20.501"
                  viewBox="0 0 20.501 20.501"
                >
                  <path
                    class="a"
                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
                  <path class="a"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                    transform="translate(-3327.144 15329)" />
                </svg>
              </span>
            </p>
            <p class="t0">
              <input
                v-model="questionData.warnUp.seven"
                class="input-bottom-border fz-18"
                style="width: 100%"
              />
              <input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18" style="width: 100%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="width: 100%"
              v-if="showAnswerOne"
            >
            <p class="event-header-text-bc pd-5" style="width: 100%" v-if="showAnswerOne">
              答案:1. Hanfu 2. Qipao 3. Tang Suit 4. Chinese tea 5. Chinese
              silk 6. Chinese calligraphy & painting 7. Chinese embroidery 8.
              Chinese papercut 9. Chinese lantern 10. Moon cake 11. Memorial
@@ -496,28 +280,19 @@
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl"
              >CHINA,A WONDERLAND</span
            >
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        </ul>a
        <div class="padding-102">
          <div class="bodystyle">
            <h3 id="c002" class="fl al-cn">
              <span class="bjh3">Listening</span>
              <audio
                :src="resource.listenOne"
                controls
                class="audio"
                @play="audioPlay"
              ></audio>
              <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
            </h3>
            <p>
              <b
                >Four foreigners are talking about their impressions on Chinese
              <b>Four foreigners are talking about their impressions on Chinese
                culture.Listen to the recording and match the items with the
                corresponding descriptions.</b
              >
                corresponding descriptions.</b>
            </p>
            <!-- <p class="center">
              <img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
@@ -531,12 +306,7 @@
            </div>
            <h3 id="c003" class="fl al-cn">
              <span class="bjh3">Reading</span>
              <audio
                :src="resource.readingOne"
                controls
                class="audio"
                @play="audioPlay"
              ></audio>
              <audio :src="resource.readingOne" controls class="audio" @play="audioPlay"></audio>
            </h3>
            <p>
              1.How was Chinese culture introduced to the world in ancient
@@ -548,33 +318,16 @@
                显示答案
              </button> -->
              <span class="btn-box" @click="showAnswerThree = !showAnswerThree">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="20.501"
                  height="20.501"
                  viewBox="0 0 20.501 20.501"
                >
                  <path
                    class="a"
                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
                  <path class="a"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                    transform="translate(-3327.144 15329)" />
                </svg>
              </span>
            </p>
            <textarea
              v-model="questionData.reading.one"
              placeholder="请输入内容"
              rows="6"
              style="margin-left: 40px; width: 92%"
              class="fz-16 fm-son"
              @change="setBookQuestion"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 91%"
              v-if="showAnswerThree"
            >
            <textarea v-model="questionData.reading.one" placeholder="请输入内容" rows="6"
              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerThree">
              答案:The Silk Road &nbsp;&nbsp;&nbsp; Immigrants Sinologist
            </p>
            <p>
@@ -587,33 +340,16 @@
                显示答案
              </button> -->
              <span class="btn-box" @click="showAnswerFour = !showAnswerFour">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="20.501"
                  height="20.501"
                  viewBox="0 0 20.501 20.501"
                >
                  <path
                    class="a"
                <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
                  <path class="a"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                    transform="translate(-3327.144 15329)" />
                </svg>
              </span>
            </p>
            <textarea
              v-model="questionData.reading.two"
              placeholder="请输入内容"
              rows="6"
              style="margin-left: 40px; width: 92%"
              class="fz-16 fm-son"
              @change="setBookQuestion"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 91%"
              v-if="showAnswerFour"
            >
            <textarea v-model="questionData.reading.two" placeholder="请输入内容" rows="6"
              style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour">
              答案:(1)Various delicious food (2)Unique architectures
              (3)Beautiful (4)Intangible cultural heritage, such as Taichi,
              shadow puppet show, traditional Chinese medicine, Peking Opera
@@ -629,41 +365,29 @@
            </p>
            <p>
              My
              <span class="word-bc" @click="saveWord($event, 'incredible')"
                >incredible</span
              >
              <span class="word-bc" @click="saveWord($event, 'incredible')">incredible</span>
              journey to China started in 2017 when I got selected as a foreign
              student for PhD studies at one university.When I arrived in
              China,I was like Alice in Alice in Wonderland.I was curious about
              the people,the culture,the
              <span class="word-bc" @click="saveWord($event, 'cuisine')"
                >cuisine</span
              >
              <span class="word-bc" @click="saveWord($event, 'cuisine')">cuisine</span>
              and of course the huge variety of
              <span class="word-bc" @click="saveWord($event, 'landscapes')"
                >landscapes</span
              >.
              <span class="word-bc" @click="saveWord($event, 'landscapes')">landscapes</span>.
            </p>
            <p>
              I found many great people and made several Chinese friends along
              the way.These friends made me see China through the eyes of the
              locals.I always found Chinese people very friendly and
              <span class="word-bc" @click="saveWord($event, 'hospitable')"
                >hospitable</span
              >
              <span class="word-bc" @click="saveWord($event, 'hospitable')">hospitable</span>
              towards foreigners.These Chinese friends made my understanding of
              Chinese culture and
              <span class="word-bc" @click="saveWord($event, 'civilization')"
                >civilization</span
              >
              <span class="word-bc" @click="saveWord($event, 'civilization')">civilization</span>
              much easier,enjoyable and memorable.I consider China my second
              home and love it like my own country!
            </p>
            <p>
              You cannot
              <span class="word-bc" @click="saveWord($event, 'explore')"
                >explore</span
              >
              <span class="word-bc" @click="saveWord($event, 'explore')">explore</span>
              China properly if you do not try its delicious variety of food.If
              you ate
            </p>
@@ -678,10 +402,7 @@
    <div class="page-box" page="10">
      <div v-if="showPageList.indexOf(10) > -1">
        <div class="w100 mb-20" style="padding-right: 20px">
          <div
            class="event-header-bc fl al-end"
            style="height: 100px; padding-left: 40px"
          >
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
@@ -695,16 +416,10 @@
              Chinese food would still never end! Though I love to eat almost
              all kinds of Chinese cuisine,I found Sichuan and Hunan cuisine
              quite
              <span class="word-bc" @click="saveWord($event, 'mouth-watering')"
                >mouth-watering</span
              >
              <span class="word-bc" @click="saveWord($event, 'mouth-watering')">mouth-watering</span>
              and
              <span class="word-bc" @click="saveWord($event, 'stimulating')"
                >stimulating</span
              >.For a
              <span class="word-bc" @click="saveWord($event, 'foodie')"
                >foodie</span
              >
              <span class="word-bc" @click="saveWord($event, 'stimulating')">stimulating</span>.For a
              <span class="word-bc" @click="saveWord($event, 'foodie')">foodie</span>
              like me,China is a heaven.I simply cannot live without Chinese
              food.
            </p>
@@ -714,15 +429,8 @@
              its own story and history.From the big and advanced cities like
              Shanghai or Guangzhou to the ancient cities like Xi’an and
              Hangzhou,each city has its
              <span class="word-bc" @click="saveWord($event, 'unique')"
                >unique</span
              >
              <span
                class="word-bc"
                style="margin-left: 5px"
                @click="saveWord($event, 'atmosphere')"
                >atmosphere</span
              >
              <span class="word-bc" @click="saveWord($event, 'unique')">unique</span>
              <span class="word-bc" style="margin-left: 5px" @click="saveWord($event, 'atmosphere')">atmosphere</span>
              that attracts you.I visited more than a dozen cities and came
              across their charming features and unique landscapes such as
              Huangshan,the Great Wall,Canton Tower.
@@ -736,18 +444,11 @@
              <img class="img-g" alt="" src="../../assets/images/0014-1.jpg" />
            </p> -->
            <p class="fl al-cn mt-40">
              <span class="zt-cs" style="font-size: 20px"
                >Words &amp; Expressions</span
              >
              <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
              <span class="line-border-box"></span>
            </p>
            <audio
              :src="resource.readingTwo"
              controls
              style="margin-left: 10px"
              class="audio"
              @play="audioPlay"
            ></audio>
            <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
              @play="audioPlay"></audio>
            <p>wonderland /ˈwʌndəlænd/ <i>n.</i> 有许多奇妙事物的地方</p>
            <div class="bkbj">
              <p><i>land or place full of marvels or wonderful things</i></p>
@@ -761,9 +462,7 @@
            </p>
            <div class="bkbj">
              <p>
                <i
                  >the food served in a restaurant (usually an expensive one)</i
                >
                <i>the food served in a restaurant (usually an expensive one)</i>
              </p>
            </div>
            <p>landscape /ˈlændskeɪp/ <i>n.</i> (陆上) 风景,景色</p>
@@ -780,20 +479,16 @@
            </p>
            <div class="bkbj">
              <p>
                <i
                  >a society,its culture and its way of life (during a
                <i>a society,its culture and its way of life (during a
                  particular period of time or in a particular part of the
                  world)</i
                >
                  world)</i>
              </p>
            </div>
            <p>explore /ɪkˈsplɔː(r)/ <i>v.</i> 探索;考察</p>
            <div class="bkbj">
              <p>
                <i
                  >to travel into or around an area or a country in order to
                  learn about it</i
                >
                <i>to travel into or around an area or a country in order to
                  learn about it</i>
              </p>
            </div>
            <p>mouth-watering <i>adj.</i> 令人垂涎的;美味的</p>
@@ -814,9 +509,7 @@
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl"
              >CHINA,A WONDERLAND</span
            >
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <div class="padding-93">
@@ -826,31 +519,25 @@
            </p>
            <div class="bkbj">
              <p>
                <i>making you feel more active and healthy</i>
                <i>making you feel more active and healthy</i>
              </p>
            </div>
            <p>foodie /ˈfuːdi/<i>n.</i> 吃货;美食家</p>
            <div class="bkbj">
              <p>
                <i
                >a person who is very interested in cooking and eating different
                kinds of food</i
              >
                <i>a person who is very interested in cooking and eating
                  different kinds of food</i>
              </p>
            </div>
            <p>
              unique /ju<i>ˈ</i>niːk/ <i>adj.</i> 唯一的;独一无二的
            </p>
            <p>unique /ju<i>ˈ</i>niːk/ <i>adj.</i> 唯一的;独一无二的</p>
            <div class="bkbj">
              <p><i>being the only one of its type</i></p>
            </div>
            <p>atmosphere /ˈætməsfɪə(r)/ <i>n.</i> 气氛;氛围</p>
            <div class="bkbj">
              <p>
                <i
                  >the feeling or mood that you have in a particular place or
                  situation</i
                >
                <i>the feeling or mood that you have in a particular place or
                  situation</i>
              </p>
            </div>
            <ul class="w100 fl fw-wr">
@@ -868,9 +555,8 @@
            <div class="bj-note">
              <p class="m0"><b class="fz-18">Notes:</b></p>
              <p class="m0">
                <i>Alice in Wonderland</i> (<i
                  >Alice's Adventures in Wonderland</i
                >的简写,中文译为《爱丽丝梦游仙境》),是19世纪英国作家刘易斯·卡罗尔创作的著名儿童文学作品,讲述了一个名叫爱丽丝的英国小女孩为了追逐一只揣着怀表、会说话的兔子而不慎掉入了兔子洞,从而进入了一个神奇的国度并经历了一系列奇幻冒险的故事。
                <i>Alice in Wonderland</i> (<i>Alice's Adventures in
                  Wonderland</i>的简写,中文译为《爱丽丝梦游仙境》),是19世纪英国作家刘易斯·卡罗尔创作的著名儿童文学作品,讲述了一个名叫爱丽丝的英国小女孩为了追逐一只揣着怀表、会说话的兔子而不慎掉入了兔子洞,从而进入了一个神奇的国度并经历了一系列奇幻冒险的故事。
              </p>
            </div>
            <p><b>Ⅰ.Reading comprehension.</b></p>
@@ -879,80 +565,34 @@
              China.
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Language"
                id="1"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
              Language
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="People"
                id="2"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="People" id="2" v-model="testData.check" />
              People
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Culture"
                id="3"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Culture" id="3" v-model="testData.check" />
              Culture
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Cuisine"
                id="4"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Cuisine" id="4" v-model="testData.check" />
              Cuisine
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Folk"
                id="5"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Folk" id="5" v-model="testData.check" />
              Folk art
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Landscapes"
                id="6"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Landscapes" id="6" v-model="testData.check" />
              Landscapes
            </p>
            <p>
              <input
                type="checkbox"
                name="ball"
                value="Transportation"
                id="7"
                v-model="testData.check"
              />
              <input type="checkbox" name="ball" value="Transportation" id="7" v-model="testData.check" />
              Transportation
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 35px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 35px; width: 93%" v-if="showQuestionAnswer">
              答案:Culture,Cuisine,Landscapes
            </p>
          </div>
@@ -966,10 +606,7 @@
    <div class="page-box" page="12">
      <div v-if="showPageList.indexOf(12) > -1">
        <div class="w100 mb-20" style="padding-right: 20px">
          <div
            class="event-header-bc fl al-end"
            style="height: 100px; padding-left: 40px"
          >
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
@@ -982,82 +619,37 @@
              B.Write down the answer to each question according to the passage.
            </p>
            <p>1.What’re the author’s comments about Chinese food?</p>
            <textarea
              v-model="testData.tx.one"
              placeholder="请输入内容"
              rows="4"
              style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <textarea v-model="testData.tx.one" placeholder="请输入内容" rows="4" style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:Chinese food is very delicious. Sichuan and Hunan cuisines
              are quite mouth-watering and stimulating.
            </p>
            <p>2.When and why did the author start her journey to China?</p>
            <textarea
              v-model="testData.tx.two"
              placeholder="请输入内容"
              rows="4"
              style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <textarea v-model="testData.tx.two" placeholder="请输入内容" rows="4" style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:When the author got selected as a foreign student for PhD
              studies at one university in 2017, she started her journey to
              China.
            </p>
            <p>3.What are the author’s expectations of her stay in China?</p>
            <textarea
              v-model="testData.tx.three"
              placeholder="请输入内容"
              rows="4"
              style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <textarea v-model="testData.tx.three" placeholder="请输入内容" rows="4" style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:The author looks forward to exploring more during her stay.
            </p>
            <p>4.What did the author think of Chinese people?</p>
            <textarea
              v-model="testData.tx.four"
              placeholder="请输入内容"
              rows="4"
              style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <textarea v-model="testData.tx.four" placeholder="请输入内容" rows="4" style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:The author thought the local Chinese were very friendly and
              hospitable.
            </p>
            <p>5.What’s the author’s impression of the cities in China?</p>
            <textarea
              v-model="testData.tx.five"
              placeholder="请输入内容"
              rows="4"
              style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <textarea v-model="testData.tx.five" placeholder="请输入内容" rows="4" style="margin-left: 40px; width: 92%"
              class="fz-16 textarea-text"></textarea>
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:Each city has its unique atmosphere with charming features
              and unique landscapes.
            </p>
@@ -1071,42 +663,20 @@
            <p>
              In 2017,the author arrived in China.When she arrived,she was like
              Alice in <i>Alice in Wonderland</i>.She was curious about the
              people,the culture,the c<input
                type="text"
                class="input-bottom-border"
                style="width: 60px"
                v-model="testData.in.one"
              />
              ,and of course the huge variety of l<input
                v-model="testData.in.two"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />.Chinese friends helped her a lot in understanding Chinese
              culture and c<input
                v-model="testData.in.three"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />.The author believes that one cannot e<input
                type="text"
                v-model="testData.in.four"
                class="input-bottom-border"
                style="width: 60px"
              />China properly if he/she does not try its delicious variety of
              people,the culture,the c<input type="text" class="input-bottom-border" style="width: 60px"
                v-model="testData.in.one" />
              ,and of course the huge variety of l<input v-model="testData.in.two" type="text"
                class="input-bottom-border" style="width: 60px" />.Chinese friends helped her a lot in understanding
              Chinese
              culture and c<input v-model="testData.in.three" type="text" class="input-bottom-border"
                style="width: 60px" />.The author believes that one cannot e<input type="text"
                v-model="testData.in.four" class="input-bottom-border" style="width: 60px" />China properly if he/she
              does not try its delicious variety of
              food.China has thousands of years of rich and beautiful
              culture.Each city has its u<input
                v-model="testData.in.five"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />atmosphere that attracts people.
              culture.Each city has its u<input v-model="testData.in.five" type="text" class="input-bottom-border"
                style="width: 60px" />atmosphere that attracts people.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:cuisine, landscapes, civilization, explore, unique
            </p>
            <p>
@@ -1114,82 +684,42 @@
              sentences with them.
            </p>
            <p>
              1.get selected as<input
                v-model="testData.line.one"
                type="text"
                class="input-bottom-border"
                style="width: 77%"
              />
              1.get selected as<input v-model="testData.line.one" type="text" class="input-bottom-border"
                style="width: 77%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:She got selected as the cultural ambassador to show Chinese
              culture on campus.
            </p>
            <p>
              2.be curious about<input
                v-model="testData.line.two"
                type="text"
                class="input-bottom-border"
                style="width: 75%"
              />
              2.be curious about<input v-model="testData.line.two" type="text" class="input-bottom-border"
                style="width: 75%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:Many foreigners are curious about the amazing Chinese
              martial arts.
            </p>
            <p>
              3.along the way<input
                v-model="testData.line.three"
                type="text"
                class="input-bottom-border"
                style="width: 77%"
              />
              3.along the way<input v-model="testData.line.three" type="text" class="input-bottom-border"
                style="width: 77%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:I suggest that you go to Tibet by train so that you can
              enjoy the natural scenery along the way.
            </p>
            <p>
              4.come across<input
                v-model="testData.line.four"
                type="text"
                class="input-bottom-border"
                style="width: 79%"
              />
              4.come across<input v-model="testData.line.four" type="text" class="input-bottom-border"
                style="width: 79%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:He came across the temple fair in Beijing during the Spring
              Festival.
            </p>
            <p>
              5.look forward to<input
                v-model="testData.line.five"
                type="text"
                class="input-bottom-border"
                style="width: 76%"
              />
              5.look forward to<input v-model="testData.line.five" type="text" class="input-bottom-border"
                style="width: 76%" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:She is looking forward to visiting the incredible cities in
              China.
            </p>
@@ -1207,9 +737,7 @@
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl"
              >CHINA,A WONDERLAND</span
            >
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <div class="padding-93">
@@ -1220,17 +748,9 @@
              people.
            </p>
            <p>
              <input
                v-model="testData.ts.one"
                type="text"
                class="input-bottom-border"
              />
              <input v-model="testData.ts.one" type="text" class="input-bottom-border" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:孔子开创了平民化的教育。
            </p>
            <p>
@@ -1238,17 +758,9 @@
              greatly promoted the development of ancient Chinese civilization.
            </p>
            <p>
              <input
                v-model="testData.ts.two"
                type="text"
                class="input-bottom-border"
              />
              <input v-model="testData.ts.two" type="text" class="input-bottom-border" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:嫘祖发明了中国缫丝技术,这极大地促进了中国古代文明的发展。
            </p>
            <p>
@@ -1256,17 +768,9 @@
              tea culture in depth.
            </p>
            <p>
              <input
                v-model="testData.ts.three"
                type="text"
                class="input-bottom-border"
              />
              <input v-model="testData.ts.three" type="text" class="input-bottom-border" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:陆羽,《茶经》的作者,对中国茶道进行了深入的研究。
            </p>
            <p>
@@ -1274,63 +778,33 @@
              Chinese medical science.
            </p>
            <p>
              <input
                v-model="testData.ts.four"
                type="text"
                class="input-bottom-border"
              />
              <input v-model="testData.ts.four" type="text" class="input-bottom-border" />
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:张仲景是一位对中国医学有着重大影响的医学家。
            </p>
            <p>
              <b>Ⅲ.Grammar focus:The conditional sentence—if-clause.</b>
              <span class="btn-box" @click="showAnswer('showImg')">
                <svg
                  t="1717037443722"
                  class="icon"
                  viewBox="0 0 1024 1024"
                  version="1.1"
                  xmlns="http://www.w3.org/2000/svg"
                  p-id="30864"
                  xmlns:xlink="http://www.w3.org/1999/xlink"
                  width="20"
                  height="20"
                >
                <svg t="1717037443722" class="icon" viewBox="0 0 1024 1024" version="1.1"
                  xmlns="http://www.w3.org/2000/svg" p-id="30864" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
                  height="20">
                  <path
                    d="M387.2 471.152l-154.768 258.72v103.488h515.792V626.384l-149.12 103.488z m283.712-51.744a77.632 77.632 0 1 0 77.392 77.616 77.504 77.504 0 0 0-77.472-77.616zM640 0H160.72A96.736 96.736 0 0 0 64 96.72V927.36a96.736 96.736 0 0 0 96.72 96.64h702.56A96.704 96.704 0 0 0 960 927.36V298.016z m7.808 94.736l226.544 211.008h-146.544a80.08 80.08 0 0 1-80-80zM896 927.36a32.688 32.688 0 0 1-32.72 32.64h-702.56A32.704 32.704 0 0 1 128 927.36V96.72A32.752 32.752 0 0 1 160.72 64l423.088 0.384v161.44a144.176 144.176 0 0 0 144 143.92H896z"
                    p-id="30865"
                  ></path>
                    p-id="30865"></path>
                </svg>
              </span>
            </p>
            <el-image
              v-if="showImg"
              :src="imgThirteen"
              :preview-src-list="[imgThirteen]"
            />
            <el-image v-if="showImg" :src="imgThirteen" :preview-src-list="[imgThirteen]" />
            <p>A.Combine the following sentences into if-clauses.</p>
            <p>
              1.Try using sticks.You can enjoy the fun of having a real Chinese
              meal.
            </p>
            <p>
              <b>If</b
              ><input
                v-model="testData.gr.one"
                type="text"
                class="input-bottom-border"
              />.
              <b>If</b><input v-model="testData.gr.one" type="text" class="input-bottom-border" />.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:If you try using sticks, you can enjoy the fun of having a
              real Chinese meal.
            </p>
@@ -1339,35 +813,17 @@
              there.
            </p>
            <p>
              <b>If</b
              ><input
                v-model="testData.gr.two"
                type="text"
                class="input-bottom-border"
              />.
              <b>If</b><input v-model="testData.gr.two" type="text" class="input-bottom-border" />.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:If you go to my Chinese New Year party, you will meet my
              Chinese friends there.
            </p>
            <p>3.Drink some Longjing tea,and you will love it.</p>
            <p>
              <b>If</b
              ><input
                type="text"
                v-model="testData.gr.three"
                class="input-bottom-border"
              />.
              <b>If</b><input type="text" v-model="testData.gr.three" class="input-bottom-border" />.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:If you drink some Longjing tea, you will love it.
            </p>
            <p>
@@ -1375,18 +831,9 @@
              warriors.
            </p>
            <p>
              <b>If</b
              ><input
                v-model="testData.gr.four"
                type="text"
                class="input-bottom-border"
              />.
              <b>If</b><input v-model="testData.gr.four" type="text" class="input-bottom-border" />.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案:If I go to Xi’an one day, I will visit the terracotta
              warriors.
            </p>
@@ -1395,18 +842,9 @@
              Chicken would possibly be in top three.
            </p>
            <p>
              <b>If</b
              ><input
                v-model="testData.gr.five"
                type="text"
                class="input-bottom-border"
              />.
              <b>If</b><input v-model="testData.gr.five" type="text" class="input-bottom-border" />.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案: If you ask foreigners about their favorite Chinese food,
              Kung Pao Chicken would possible be in top three
            </p>
@@ -1415,51 +853,27 @@
              <i>whether</i>.
            </p>
            <p>
              1.I was wondering<input
                v-model="testData.cm.one"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />to go for a walk in the Summer Palace.
              1.I was wondering<input v-model="testData.cm.one" type="text" class="input-bottom-border"
                style="width: 60px" />to go for a walk in the Summer Palace.
            </p>
            <p>
              2.We can spend the afternoon on the beach<input
                v-model="testData.cm.two"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />the weather is fine.
              2.We can spend the afternoon on the beach<input v-model="testData.cm.two" type="text"
                class="input-bottom-border" style="width: 60px" />the weather is fine.
            </p>
            <p>
              3.I called Wang to find out<input
                v-model="testData.cm.three"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />or not he really went to see the Peking opera show.
              3.I called Wang to find out<input v-model="testData.cm.three" type="text" class="input-bottom-border"
                style="width: 60px" />or not he really went to see the Peking opera show.
            </p>
            <p>
              4.We’re not interested in<input
                v-model="testData.cm.four"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />we get great jobs and that kind of thing.
              4.We’re not interested in<input v-model="testData.cm.four" type="text" class="input-bottom-border"
                style="width: 60px" />we get great jobs and that kind of thing.
            </p>
            <p>
              5.<input
                v-model="testData.cm.five"
                type="text"
                class="input-bottom-border"
                style="width: 60px"
              />I go to Sichuan,I will visit Chengdu Research Base of Giant
              5.<input v-model="testData.cm.five" type="text" class="input-bottom-border" style="width: 60px" />I go to
              Sichuan,I will visit Chengdu Research Base of Giant
              Panda Breeding.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
            <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
              答案: 1.whether &nbsp; 2.if &nbsp; 3.whether &nbsp; 4.whether
              &nbsp; 5.if
            </p>
@@ -1481,10 +895,7 @@
                  </button>
                </li>
                <li>
                  <button
                    @click="showQuestionAnswer = !showQuestionAnswer"
                    class="parimary-btn"
                  >
                  <button @click="showQuestionAnswer = !showQuestionAnswer" class="parimary-btn">
                    查看答案
                  </button>
                </li>
@@ -1501,10 +912,7 @@
    <div class="page-box" page="14">
      <div v-if="showPageList.indexOf(14) > -1">
        <div class="w100 mb-20" style="padding-right: 20px">
          <div
            class="event-header-bc fl al-end"
            style="height: 100px; padding-left: 40px"
          >
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
@@ -1532,19 +940,9 @@
              <p>    3.What does he/she know about it?</p>
            </div>
            <p class="left">
              <img
                class="img-gn"
                alt=""
                src="../../assets/images/dy1-worksheet.jpg"
              />
              <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
            </p>
            <table
              border="1"
              cellpadding="4"
              cellspacing="0"
              style="border-color: #fff"
              class="fz-14"
            >
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn">Interviewees</td>
                <td class="wh-no tl-cn">Chinese Culture</td>
@@ -1563,133 +961,64 @@
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea
                    v-model="questionData.table.one"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.two"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.three"
                    class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea
                    v-model="questionData.table.four"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.five"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.six"
                    class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea
                    v-model="questionData.table.seven"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.enight"
                    class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea
                    v-model="questionData.table.nine"
                    class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"
                  ></textarea>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
            <p class="left">
              <img
                class="img-gn"
                alt=""
                src="../../assets/images/dy1-wordbank.jpg"
              />
              <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
            </p>
            <div class="bk-wh">
              <p class="dl-box">
                <span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'exquisite')"
                  >exquisite</span
                >
                <span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'ancient')"
                  >ancient</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'incredible')"
                  >incredible</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'unique')"
                  >unique</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'traditional')"
                  >traditional</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'outstanding')"
                  >outstanding</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'mouth-watering')"
                  >mouth-watering</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'diverse')"
                  >diverse</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'hospitable')"
                  >hospitable</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'enjoyable')"
                  >enjoyable</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'memorable')"
                  >memorable</span
                ><span
                  class="word-bc mr-20 dl-span"
                  @click="saveWord($event, 'charming')"
                  >charming</span
                >
                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'exquisite')">exquisite</span>
                <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'ancient')">ancient</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'incredible')">incredible</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'unique')">unique</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'traditional')">traditional</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'outstanding')">outstanding</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'mouth-watering')">mouth-watering</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'diverse')">diverse</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'hospitable')">hospitable</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'enjoyable')">enjoyable</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'memorable')">memorable</span><span
                  class="word-bc mr-20 dl-span" @click="saveWord($event, 'charming')">charming</span>
              </p>
            </div>
            <div class="resource-primary-border" style="padding: 8px">
@@ -1853,9 +1182,7 @@
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl"
              >CHINA,A WONDERLAND</span
            >
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <div class="padding-93">
@@ -1865,10 +1192,8 @@
            </h2>
            <h3 id="c005"><span class="bjh3">Warm-up</span></h3>
            <p>
              <b
                >Put the expressions in the box below on the corresponding
                answer line under each picture.</b
              >
              <b>Put the expressions in the box below on the corresponding
                answer line under each picture.</b>
            </p>
            <div class="bk-wh">
              <p>
@@ -1881,136 +1206,68 @@
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-1.jpg"
                        alt=""
                        class="w100"
                      />
                      <img src="../../assets/images/0019-1.jpg" alt="" class="w100" />
                    </p>
                    <p class="center">
                      1.
                      <select v-model="dropdownData.one.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.one.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.one.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.one.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.one.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:intercity train
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-2.jpg"
                        alt=""
                        style="width: 98%"
                      />
                      <img src="../../assets/images/0019-2.jpg" alt="" style="width: 98%" />
                    </p>
                    <p class="center">
                      2.
                      <select v-model="dropdownData.two.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.two.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.two.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.two.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.two.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:online shopping
                  </p>
                </div>
@@ -2020,136 +1277,68 @@
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-3.jpg"
                        alt=""
                        style="width: 98%"
                      />
                      <img src="../../assets/images/0019-3.jpg" alt="" style="width: 98%" />
                    </p>
                    <p class="center">
                      3.
                      <select v-model="dropdownData.three.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.three.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.three.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.three.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.three.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:electronic payment
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-4.jpg"
                        alt=""
                        style="width: 94%"
                      />
                      <img src="../../assets/images/0019-4.jpg" alt="" style="width: 94%" />
                    </p>
                    <p class="center">
                      4.
                      <select v-model="dropdownData.four.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.four.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.four.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.four.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.four.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:shared bike
                  </p>
                </div>
@@ -2159,136 +1348,68 @@
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-5.jpg"
                        alt=""
                        class="w100"
                      />
                      <img src="../../assets/images/0019-5.jpg" alt="" class="w100" />
                    </p>
                    <p class="center">
                      5.
                      <select v-model="dropdownData.five.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.five.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.five.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.five.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.five.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:take-away service
                  </p>
                </div>
                <div class="right" style="width: 48%">
                  <div>
                    <p class="center">
                      <img
                        src="../../assets/images/0019-6.jpg"
                        alt=""
                        style="width: 98%"
                      />
                      <img src="../../assets/images/0019-6.jpg" alt="" style="width: 98%" />
                    </p>
                    <p class="center">
                      6.
                      <select v-model="dropdownData.six.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                        <option v-for="(item, index) in dropDownList" :key="index" :value="item">
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.six.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                        <svg v-if="dropdownData.six.isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024"
                          version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="20">
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                            fill="#1AFA29" p-id="18768"></path>
                        </svg>
                        <svg
                          v-if="dropdownData.six.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                        <svg v-if="dropdownData.six.isRight == false" t="1716987085767" class="icon"
                          viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20">
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                            fill="#d81e06" p-id="25746"></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                  <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                    答案:facial recognition
                  </p>
                </div>
@@ -2296,10 +1417,7 @@
            </div>
            <div class="w100 fl ju-cn">
              <div class="fl ju-ev mt-40" style="width: 80%">
                <button
                  class="btn-border btn-w"
                  @click="handleDropdown('judge')"
                >
                <button class="btn-border btn-w" @click="handleDropdown('judge')">
                  提交
                </button>
                <button @click="setDropdownData" class="btn-border btn-w">
@@ -2308,10 +1426,7 @@
                <button class="btn-border btn-w" @click="changeDropdown">
                  重做
                </button>
                <button
                  @click="showAnswerFive = !showAnswerFive"
                  class="parimary-btn"
                >
                <button @click="showAnswerFive = !showAnswerFive" class="parimary-btn">
                  查看答案
                </button>
              </div>
@@ -2320,6 +1435,759 @@
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">9</span>
        </div>
      </div>
    </div>
    <!-- 10 -->
    <div class="page-box" page="16">
      <div v-if="showPageList.indexOf(16) > -1">
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
        <div class="padding-93">
          <div class="bodystyle">
            <h3 id="c006"><span class="bjh3">Reading</span></h3>
            <p class="center">
              <img class="img-g" alt="" src="../../assets/images/0020-1.jpg" />
            </p>
            <p class="img"></p>
            <p>
              1.We are witnessing the rapid development of modern society.What
              impresses you most?
            </p>
            <p>2.What will our life be like in ten or twenty years?</p>
            <p class="center"><b>The Great Progress in China</b></p>
            <p>
              On August 31st,2012,as I landed my feet on Chinese ground,I
              started to breathe in the air coming from the breeze.It was
              familiar.I felt so excited to be back in China,though that time
              was for my studies.In a matter of days,I made a lot of friends
              from different countries and one afternoon,my friends and I
              planned to visit the world-famous Sun Yat-sen
              Mausoleum.A._______________ I looked around with curiosity,and
              everything seemed to move at a quick pace.
            </p>
            <p>
              Six months later,as I walked down the hall of my dormitory,I met
              my neighbour who was overwhelmed by big and small packages and
              boxes.I asked,“Hey,Alison.What are all these?” She
              replied,“Hello,Vanessa.I received my packages from the delivery
              man.I’ve been buying a lot of stuff via an online shop.” I went to
              my room to turn on my laptop and typed in the key words.I was
              stunned; I couldn’t believe my eyes.It is actually an online
              shopping website where you can buy anything you can think of.
            </p>
            <p>
              After my graduation in 2015,I joined another university in
              Shanghai for further studies.I always saw my Chinese classmates
              paying with their phones; this triggered my attention.With the
              help of my classmates,I finally got my own online payment
              account.This is an absolute gadget,very convenient and easy to
              use.With the start of this new era,I always go out without my
              wallet.
            </p>
            <p>
              B._______________ I went through all the necessary procedures and
              couldn’t wait to ride my first shared bike.
            </p>
            <p>
              Last but not least,nearly at the end of 2016,the ordering
              platforms made their appearance on all Chinese
              phones.C._______________ What makes my life easier is that I can
              buy vegetables and fruits online and get them delivered to my
              door.
            </p>
            <p>
              The five aspects that I mentioned above changed the life of
              millions of people around China.The Chinese economy is
              booming,which makes people well off.I’ve been in China for several
              years and witnessed China’s potential.
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">10</span>
        </div>
      </div>
    </div>
    <!-- 11 -->
    <div class="page-box" page="17">
      <div v-if="showPageList.indexOf(17) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p class="fl al-cn mt-40">
              <span class="zt-cs" style="font-size: 20px">Words &amp; Expressions</span>
              <span class="line-border-box"></span>
            </p>
            <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
              @play="audioPlay"></audio>
            <p>breeze /briːz/ <i>n.</i> 微风;和风</p>
            <div class="bkbj">
              <p><i>a light wind</i></p>
            </div>
            <p>mausoleum /ˌmɔːsəˈliːəm/ <i>n.</i> (大而精致的) 陵墓</p>
            <div class="bkbj">
              <p><i>a large,finely built tomb</i></p>
            </div>
            <p>metro /ˈmetrəʊ/ <i>n.</i> 地铁</p>
            <div class="bkbj">
              <p><i>an underground train system</i></p>
            </div>
            <p>extraordinary /ɪkˈstrɔːdnri/ <i>adj.</i> 非凡的;不普通的</p>
            <div class="bkbj">
              <p><i>beyond what is ordinary; remarkable</i></p>
            </div>
            <p>pace /peɪs/ <i>n.</i> 速度</p>
            <div class="bkbj">
              <p><i>speed,esp.of walking or running</i></p>
            </div>
            <p>dormitory /ˈdɔːmətri/ <i>n.</i> 学生宿舍;集体宿舍</p>
            <div class="bkbj">
              <p>
                <i>a room for several people to sleep in,esp.in a school or
                  other institution</i>
              </p>
            </div>
            <p>neighbour /ˈneɪbə(r)/ <i>n.</i> 邻居;邻人</p>
            <div class="bkbj">
              <p><i>a person who lives next to you or near you</i></p>
            </div>
            <p>overwhelm /ˌəʊvəˈwelm/ <i>v.</i> 淹没;漫过</p>
            <div class="bkbj">
              <p><i>to cover sb./sth.completely</i></p>
            </div>
            <p>via /ˈvaɪə/ <i>prep.</i> 经由;通过</p>
            <div class="bkbj">
              <p><i>by way of; through</i></p>
            </div>
            <p>laptop /ˈlæptɒp/ <i>n.</i> 便携式电脑;笔记本电脑</p>
            <div class="bkbj">
              <p>
                <i>a small computer that can work with a battery and be easily
                  carried</i>
              </p>
            </div>
            <p>stun /stʌn/ <i>v.</i> 使震惊(或惊愕、目瞪口呆)</p>
            <div class="bkbj">
              <p>
                <i>to surprise or shock sb.so much that he/she cannot think
                  clearly or speak</i>
              </p>
            </div>
            <p>trigger /ˈtrɪɡə(r)/ <i>v.</i> 引起;触发</p>
            <div class="bkbj">
              <p><i>to make sth.happen suddenly</i></p>
            </div>
            <p>gadget /ˈɡædʒɪt/<i> n.</i> 小器具;小装置</p>
            <div class="bkbj">
              <p><i>a small tool or device that does sth.useful</i></p>
            </div>
            <p>era /ˈɪərə/ <i>n.</i> 时代;年代</p>
            <div class="bkbj">
              <p>
                <i>a period of time,usually in history,that is different from
                  other periods because of particular characteristics or
                  events</i>
              </p>
            </div>
            <p>economy /ɪˈkɒnəmi/ <i>n.</i> 经济;经济情况</p>
            <div class="bkbj">
              <p>
                <i>the relationship between production,trade and the supply of
                  money in a particular country or region</i>
              </p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">11</span>
        </div>
      </div>
    </div>
    <!-- 12 -->
    <div class="page-box" page="18">
      <div v-if="showPageList.indexOf(18) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>boom /buːm/ <i>v.</i> 迅速发展;繁荣昌盛</p>
            <div class="bkbj">
              <p>
                <i>to have a period of rapid growth; to become bigger,more
                  successful,etc.</i>
              </p>
            </div>
            <p>potential /pəˈtenʃl/ <i>n.</i> 潜力;潜能</p>
            <div class="bkbj">
              <p><i>qualities that exist and can be developed</i></p>
            </div>
            <div style="display: flex">
              <div class="left" style="width: 48%">
                <p>a matter of days 仅仅几天</p>
                <p>go through 办理(手续);经历</p>
                <p>well off (尤指) 富裕</p>
              </div>
              <div class="right" style="width: 48%">
                <p>type in ...键入……</p>
                <p>last but not least 最后同样重要的是</p>
              </div>
            </div>
            <p><b>Ⅰ.Reading comprehension.</b></p>
            <p>
              A.Read the passage and put the following sentences in the proper
              blanks.
            </p>
            <p>
              1.It wasn’t long until I discovered the shared bikes in
              2016,serving people in several cities.
            </p>
            <p>
              2.People can order their desired food,from soup to noodles,from
              barbecue to hot pot.
            </p>
            <p>
              3.It was at that moment that I knew about the metro system.It was
              new,fast,and extraordinary.
            </p>
            <p>
              B.Decide whether the following statements are true (T) or false
              (F).
            </p>
            <p>
              ( ) 1.Vanessa made a lot of friends as soon as she arrived in
              China.
            </p>
            <p>
              ( ) 2.Before Vanessa came to China,she knew a lot about the metro
              system.
            </p>
            <p>
              ( ) 3.Vanessa didn’t know about online shopping before she met
              her neighbour Alison.
            </p>
            <p>( ) 4.Vanessa got her own online payment account by herself.</p>
            <p>
              ( ) 5.Buying vegetables and fruits online makes Vanessa’s life
              easier.
            </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.Tom was shocked by China’s progress that she had
              <i>noticed</i>.________
            </p>
            <p>
              2.China has made <i>amazing</i> progress in the manufacturing
              industry.________
            </p>
            <p>
              3.Ordering platforms supported <i>by</i> various Apps is very
              convenient.________
            </p>
            <p>
              4.The <i>age</i> of artificial intelligence was brought into being
              by the Internet.________
            </p>
            <p>
              5.The <i>rhythm</i> of ancient people’s lives is slower than that
              of modern people.________
            </p>
            <p>
              B.Fill in the blanks with the proper form of the expressions given
              below.
            </p>
            <div class="bk-wh">
              <p>
                a matter of go through last but not least well off type in
              </p>
            </div>
            <p>1.China has________great changes in the era of big data.</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">12</span>
        </div>
      </div>
    </div>
    <!-- 13 -->
    <div class="page-box" page="19">
      <div v-if="showPageList.indexOf(19) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              2.________key words and you can search for the needed goods in
              online shops.
            </p>
            <p>
              3.A dispute over online shopping can be settled in________days.
            </p>
            <p>4.China has,in all respects,become very________.</p>
            <p>
              5.________,all the people committed to Shenzhou Spacecrafts
              deserve respect.
            </p>
            <p><b>Ⅲ.Grammar focus:The simple sentence.</b></p>
            <p>
              Read the examples and write down the sentence structure of the
              following sentences in the brackets.
            </p>
            <p><b>Examples:</b></p>
            <div class="fieldset">
              <p>1.My incredible journey to China started in 2017.(S+V)</p>
              <p>2.Vanessa made a lot of friends.(S+V+O)</p>
              <p>3.Local Chinese are very friendly.(S+V+P)</p>
              <p>
                4.China gives the author the impression of a
                wonderland.(S+V+O+O)
              </p>
              <p>
                5.I always saw my Chinese classmates paying with their
                phones.(S+V+O+C)
              </p>
            </div>
            <p>1.It is actually an online shopping website.(________)</p>
            <p>
              2.Vanessa finally got her own online payment account.(________)
            </p>
            <p>
              3.China offers researchers world-class advanced research
              facilities in the institutes. (________)
            </p>
            <p>
              4.These friends made Vanessa see China through the eyes of the
              locals.(________)
            </p>
            <p>5.The list of Chinese food never ends.(________)</p>
            <h3 id="c007"><span class="bjh3">Mini-project</span></h3>
            <p>
              Life today is much better than that of 10 years ago.Work in
              groups,and find out the major changes.Each group should list at
              least three items and offer suggestions on how to keep up with the
              changes,then report to the class.
            </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">Items</td>
                <td class="wh-no tl-cn">A Decade Ago</td>
                <td class="tl-cn">Now</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Transportation</td>
                <td class="tl-cn">
                  We had our own bikes because they were major vehicles and most
                  families had bikes.
                </td>
                <td>
                  We needn't have our own bikes, butwe ride shared bikes because
                  they arevery convenient and cheap,
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">13</span>
        </div>
      </div>
    </div>
    <!-- 14 -->
    <div class="page-box" page="20">
      <div v-if="showPageList.indexOf(20) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn">Items</td>
                <td class="wh-no tl-cn">A Decade Ago</td>
                <td class="tl-cn">Now</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Shopping</td>
                <td class="tl-cn">
                  We bought necessities mainly in brick-and-mortar stores.
                </td>
                <td>Online shopping is very common.</td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td colspan="3">
                  Your suggestion:
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
            <h2 id="b002">
              <img class="img-0" alt="" src="../../assets/images/dy1-le3.jpg" />
            </h2>
            <h3 id="c008"><span class="bjh3">Listening</span></h3>
            <p>
              <b>Ⅰ.Listen to Tom,an overseas student,talking about his journey
                to China and fill in the blanks with what you hear.</b>
            </p>
            <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
              @play="audioPlay"></audio>
            <p>
              After studying in China for almost three years by now,I call China
              my second homeland.I love the natural beauty,the 1.________,the
              people and the food.China is a large country with diverse
              landscapes awaiting adventurers to 2.________.There is a modern
              public transportation system including city
              buses,3.________,high-speed trains,and airports,as well as a large
              highway network.These make travel 4.________and efficient and
              allow me to go to many places to enjoy the scenery and
              culture.China’s natural beauty keeps on 5.________me,from the pure
              blue waterfalls in Jiuzhaigou to the snowcapped mountains of
              Shangri-la,from the sandy 6.________of Sanya to the rocky seaside
              of Laoshan… China is such a beautiful country!
            </p>
            <p>
              <b>Ⅱ.Listen to the conversation about planning for the upcoming
                Chinese Culture Week and circle the right expressions to
                complete the following sentences.</b>
            </p>
            <p>
              1.They would like to organize an activity for foreign students to
              experience Chinese handcrafts / learn Chinese calligraphy.
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">14</span>
        </div>
      </div>
    </div>
    <!-- 15 -->
    <div class="page-box" page="21">
      <div v-if="showPageList.indexOf(21) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              2.They decide to hold a Chinese crafts show / paper-cutting
              contest.
            </p>
            <p>3.Linda is to design the posters / reserve rooms.</p>
            <p>
              4.Li Hong is to invite students to compete in the contest /
              handcraftsmen to show their talent.
            </p>
            <p>
              5.Zhang Ping is to arrange the room set-up / send out invitations.
            </p>
            <h3 id="c009"><span class="bjh3">Practical Writing</span></h3>
            <p>Work with your partner to discuss the following questions.</p>
            <p>1.How do you let others know about an upcoming event?</p>
            <p>
              2.What information would you like to tell them about the event?
            </p>
            <p>
              <b>Ⅰ.Read the following tips for designing an event poster and
                mark the key elements in the following poster.</b>
            </p>
            <p>
              An event poster is a marketing tool designed to attract visitors
              to an upcoming gathering.With right design elements,a poster can
              successfully impress a wide audience.The following are some tips
              for creating an effective event poster.
            </p>
            <p>▲ Use a large and eye-catching font for the title.</p>
            <p>▲ Add the date,time and location of the event.</p>
            <p>▲ Add the logo or branding of the organizer.</p>
            <p>▲ Describe your event or why people should attend.</p>
            <p>▲ Include a relevant call to action.</p>
            <div class="horizontal" style="display: flex">
              <div class="left" style="width: 48%">
                <p class="center">
                  <img class="img-e" alt="" src="../../assets/images/0025-1.jpg" />
                </p>
              </div>
              <div class="right" style="width: 48%">
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Name of the event
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Date and time
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Location
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Greetings
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Warnings
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Organizer
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Signature
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  A short description of the event
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Contact information
                </p>
                <p>
                  <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
                  Pictures of the event
                </p>
              </div>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">15</span>
        </div>
      </div>
    </div>
    <!-- 16 -->
    <div class="page-box" page="22">
      <div v-if="showPageList.indexOf(22) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              <b>Ⅱ.DIY Crafts Club is planning a paper-cutting contest to
                promote Chinese handicrafts.The contest will be held in the
                lobby of Student Center at</b>6:00-8:00<b> November</b>16<b>.You're in charge of publicity in the club
                and are required to
                design a poster for the contest.Complete the necessary
                information in the following poster.</b>
            </p>
            <p class="center">
              <img class="img-a" alt="" src="../../assets/images/0026-1.jpg" />
            </p>
            <p>
              <b>Ⅲ.Your class has prepared a Chinese culture exhibition for
                foreign exchange students.Your group takes the responsibility of
                designing a poster for it.Discuss with your partner and try to
                answer the questions below to find out what information is
                needed.</b>
            </p>
            <div class="dy1-bj4">
              <p class="center"><b>Information to put into our poster</b></p>
            </div>
            <div class="dy1-bj5">
              <p>1.What can be the title of the exhibition?</p>
              <p>_________________________________________</p>
              <p>2.What should be included in the exhibition?</p>
              <p>_________________________________________</p>
              <p>3.Where will the exhibition be held?</p>
              <p>_________________________________________</p>
              <p>4.When will the exhibition be held?</p>
              <p>_________________________________________</p>
              <p>...</p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">16</span>
        </div>
      </div>
    </div>
    <!-- 17 -->
    <div class="page-box" page="23">
      <div v-if="showPageList.indexOf(23) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc">MODULE 1</span>
            <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              Ⅳ<b>.Design a poster for the exhibition according to the
                information in the table above.</b>
            </p>
            <p class="center">
              <img class="img-b" alt="" src="../../assets/images/0027-1.jpg" />
            </p>
            <div class="un-h2">
              <h2 id="b004">Unit Project</h2>
            </div>
            <p>
              The Youth League of your college is planning to organize an
              activity called Chinese Culture Conversation Circle for
              international students.This activity is to help them get a better
              understanding of China and integrate into Chinese culture and life
              faster.Work in groups and make a plan for this event.
            </p>
            <p>
              Step 1:Brainstorm some activities and topics to discuss.For
              example,Chinese cuisine,ethnic groups,handicrafts.
            </p>
            <p>
              Step 2:Create a poster with such information as the date,the
              time,the location,the contact information,etc.
            </p>
            <p>
              Step 3:Display your poster to the class and introduce the
              highlights of your activity.
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">17</span>
        </div>
      </div>
    </div>
    <!-- 18 -->
    <div class="page-box" page="24">
      <div v-if="showPageList.indexOf(24) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p class="left">
              <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
            </p>
            <p class="center">
              <img class="img-b" alt="" src="../../assets/images/0028-1.jpg" />
            </p>
            <div class="fieldset-1">
              <p class="center">
                <b>Questions You May Ask When Planning an Event</b>
              </p>
              <p>How many people do you need to make the event happen?</p>
              <p>What resources do you need?</p>
              <p>What does the audience need to know?</p>
              <p>What will hold the audience’s interest?</p>
              <p>What do you hope to achieve through this event?</p>
            </div>
          </div>
          <div class="preface-bottom">
            <span class="contet-num-box">18</span>
          </div>
        </div>
      </div>
    </div>
@@ -2676,7 +2544,7 @@
      };
    },
    setBookQuestion() {
      console.log('保存');
      console.log("保存");
      localStorage.setItem(
        "english-book-question-one",
        JSON.stringify(this.questionData)
@@ -2702,32 +2570,32 @@
      if (type == "one") {
        this.questionData.warnUp.one.value
          ? (this.questionData.warnUp.one.isRight =
              this.questionData.warnUp.one.value == "Chinese knot")
            this.questionData.warnUp.one.value == "Chinese knot")
          : (this.questionData.warnUp.one.isRight = null);
      } else if (type == "two") {
        this.questionData.warnUp.two.value
          ? (this.questionData.warnUp.two.isRight =
              this.questionData.warnUp.two.value == "Chinese medicine")
            this.questionData.warnUp.two.value == "Chinese medicine")
          : (this.questionData.warnUp.two.isRight = null);
      } else if (type == "three") {
        this.questionData.warnUp.three.value
          ? (this.questionData.warnUp.three.isRight =
              this.questionData.warnUp.three.value == "Chinese calligraphy")
            this.questionData.warnUp.three.value == "Chinese calligraphy")
          : (this.questionData.warnUp.three.isRight = null);
      } else if (type == "four") {
        this.questionData.warnUp.four.value
          ? (this.questionData.warnUp.four.isRight =
              this.questionData.warnUp.four.value == "Taichi")
            this.questionData.warnUp.four.value == "Taichi")
          : (this.questionData.warnUp.four.isRight = null);
      } else if (type == "five") {
        this.questionData.warnUp.five.value
          ? (this.questionData.warnUp.five.isRight =
              this.questionData.warnUp.five.value == "sweet dumpling")
            this.questionData.warnUp.five.value == "sweet dumpling")
          : (this.questionData.warnUp.five.isRight = null);
      } else if (type == "six") {
        this.questionData.warnUp.six.value
          ? (this.questionData.warnUp.six.isRight =
              this.questionData.warnUp.six.value == "Chinese chess")
            this.questionData.warnUp.six.value == "Chinese chess")
          : (this.questionData.warnUp.six.isRight = null);
      }
    },
@@ -2739,7 +2607,7 @@
          item.value == item.answer
            ? (item.isRight = true)
            : (item.isRight = false);
            console.log(item.value,item.answer);
          console.log(item.value, item.answer);
        }
      }
      this.dropdownData = dropdownDatas;
@@ -2772,9 +2640,11 @@
p {
  font-size: 16px !important;
}
.bodystyle {
  margin: 0 !important;
}
.line-border-box {
  margin-left: 10px;
  display: inline-block;
@@ -2782,12 +2652,15 @@
  height: 3px;
  background-color: #f9a71b;
}
.mr-20 {
  margin-right: 20px;
}
.dl-box {
  display: flex;
  flex-wrap: wrap;
  .dl-span {
    display: inline-block;
    text-indent: 0;
@@ -2796,17 +2669,20 @@
    line-height: 20px;
  }
}
.btn-w {
  font-size: 14px;
  border-width: 1px;
  min-width: 80px;
  height: 30px;
  background-color: #fff;
  &:hover {
    background-color: #0bab87;
    color: #fff;
  }
}
.banshi {
  position: relative;
  margin-top: 40px;
@@ -2814,6 +2690,7 @@
  height: 350px;
  margin: 0 auto;
}
.pageBox {
  z-index: 9999999999;
  color: #999;
@@ -2821,9 +2698,11 @@
  left: 48%;
  bottom: 0px;
}
select {
  height: 24px;
}
.mini-audio {
  width: 200px;
  height: 200px;
src/books/English/view/components/chapter002.vue
New file
@@ -0,0 +1,2008 @@
<template>
  <div class="chapter" num="3">
    <!-- 19 -->
    <div class="page-box" page="25">
      <div class="bodystyle" v-if="showPageList.indexOf(25) > -1">
        <h1 id="a005">
          <img class="img-0" alt="" src="../../assets/images/dy2.jpg" />
        </h1>
        <p class="img"></p>
        <p><b>This unit will help you to:</b></p>
        <p>➢ Learn words and expressions about different cultures</p>
        <p>
          ➢ Review the usage of “it” as formal subject and active and passive
          voice
        </p>
        <p>
          ➢ Be able to express differences and similarities among cultural
          groups
        </p>
        <p>➢ Be able to make an event schedule effectively and properly</p>
        <p>➢ Develop cross-cultural understanding in the workplace</p>
        <p class="center">
          <img class="img-0" alt="" src="../../assets/images/0029-1.jpg" />
        </p>
        <p class="img"></p>
      </div>
    </div>
    <!-- 20 -->
    <div class="page-box" page="26">
      <div v-if="showPageList.indexOf(26) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <h2 id="b005">
              <img class="img-0" alt="" src="../../assets/images/dy2-le1.jpg" />
            </h2>
            <h3 id="c010"><span class="bjh3">Warm-up</span></h3>
            <p>
              <b>Ⅰ.Draw a line to connect each country with its cultural
                features and facts.</b>
            </p>
            <p class="center">
              <img class="img-a" alt="" src="../../assets/images/0030-1.jpg" />
            </p>
            <p>
              <b>Ⅱ.What are the customs and cultures of other countries you
                know? Work with your partner to complete the table below.</b>
            </p>
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn">Countries</td>
                <td class="tl-cn">Customs and Cultures</td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two"
                    class="w100 table-tr-bc b0 table-textarea textarea-box-right" @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.four"
                    class="w100 table-tr-bc b0 table-textarea textarea-box-right" @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.six"
                    class="w100 table-tr-bc b0 table-textarea textarea-box-right" @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight"
                    class="w100 table-tr-bc b0 table-textarea textarea-box-right" @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">20</span>
        </div>
      </div>
    </div>
    <!-- 21 -->
    <div class="page-box" page="27">
      <div v-if="showPageList.indexOf(27) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <h3 id="c011"><span class="bjh3">Listening</span></h3>
            <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
            <p>
              <b>Four people are sharing their experiences of working with their
                colleagues.Listen to the recording and mark the true statements
                according to the speaker.</b>
            </p>
            <p class="center">
              <img class="img-a" alt="" src="../../assets/images/0031-3.jpg" />
            </p>
            <h3 id="c012"><span class="bjh3">Reading</span></h3>
            <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
            <p>
              1.Culture shock is a normal part of the life when moving somewhere
              new,such as travelling abroad,or studying abroad.So,what’s the
              definition of culture shock?
            </p>
            <p>
              2.Can you offer some examples of culture shock in regard to
              different languages,different table manners or different food
              customs?
            </p>
            <p class="center"><b>Challenges of Working Across Cultures</b></p>
            <p>
              It is not a secret that a company’s success is heavily based on
              its people.An employee is defined by his/her talents,knowledge and
              abilities.This is the “visible” side of an employee.The
              “hidden”side,which is also important,is the cultural identity.The
              culture of an employee impacts his/her views on life,work,business
              relationships and how they handle challenges.There are some issues
              that may arise when working in a cross-cultural environment.
            </p>
            <p>
              When your colleagues speak different languages,it is easy to
              misunderstand each other.When I applied for the position at an
              international trade company,during the interview,my
              interviewer,who is from Egypt,was saying “quote”,but to me,it
              sounded like “court”.It took me a while to
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">21</span>
        </div>
      </div>
    </div>
    <!-- 22 -->
    <div class="page-box" page="28">
      <div v-if="showPageList.indexOf(28) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              understand what he meant,and I still remember how confused I felt
              when I had to reply without knowing what he was asking about.You
              may feel uncomfortable to ask your conversation partner to repeat
              the sentence.However,it will save you from making mistakes and
              show your partner that you are really trying your best to
              understand him.
            </p>
            <p>
              Things that are normal or routine in one culture can be totally
              unacceptable in another culture.In my home country of Latvia,it is
              a normal practice not to expect replies by email after normal
              working hours and I will only disturb a colleague if the matter is
              very serious.However,in other countries,like Russia and Egypt,the
              tendency is to work 24/7 in response to the industry needs.Get
              familiar with the behavior patterns accepted in your colleagues’
              countries,and learn about their traditions,you will finally find
              the best way to respectfully communicate.
            </p>
            <p>
              Language and cultural barriers can cause frustration.Don’t let
              emotions take over.Think about the objective you want to
              reach,make an effort to understand the other person and use the
              most appropriate means for it.For example,email does not convey
              the speaker’s emotions and limits the possibility to ask
              questions.Calling someone on the phone and hearing his/her tone
              can make the communication more smooth,and you will be surprised
              by the level of understanding you will receive in return.
            </p>
            <p>
              Working with colleagues from other countries or cultures can at
              times be challenging,but it is so rewarding when you can learn
              from each other and open your eyes to other ways of 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.listenOne" controls class="audio" @play="audioPlay"></audio>
            <p>define /dɪˈfaɪn/ <i>v.</i> 给……下定义</p>
            <div class="bkbj">
              <p><i>to state precisely the meaning of sth.</i></p>
            </div>
            <p>visible /ˈvɪzəbl/ <i>adj.</i> 可见的;明显的</p>
            <div class="bkbj">
              <p><i>that can be seen or obvious enough to be noticed</i></p>
            </div>
            <p>identity /aɪˈdentəti/ <i>n.</i> 特性;身份</p>
            <div class="bkbj">
              <p>
                <i>the characteristics,feelings or beliefs that make people
                  different from others</i>
              </p>
            </div>
            <p>handle /ˈhændl/ <i>v.</i> 处理;应对</p>
            <div class="bkbj">
              <p>
                <i>to deal with a situation,a person,an area of work or a strong
                  emotion</i>
              </p>
            </div>
            <p>arise /əˈraɪz/ <i>v.</i> 出现;产生</p>
            <div class="bkbj">
              <p>
                <i>(esp.of a problem or a difficult situation) to happen</i>
              </p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">22</span>
        </div>
      </div>
    </div>
    <!-- 23 -->
    <div class="page-box" page="29">
      <div v-if="showPageList.indexOf(29) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>quote /kwəʊt/ <i>v.</i> 报(价)</p>
            <div class="bkbj">
              <p><i>to name (an amount) as the price of sth.</i></p>
            </div>
            <p>confused /kənˈfjuːzd/ <i>adj.</i> 糊涂的</p>
            <div class="bkbj">
              <p><i>unable to think clearly</i></p>
            </div>
            <p>routine /ruːˈtiːn/ <i>adj.</i> 平常的</p>
            <div class="bkbj">
              <p><i>usual</i></p>
            </div>
            <p>unacceptable /ˌʌnəkˈseptəbl/ <i>adj.</i> 不能接受的</p>
            <div class="bkbj">
              <p><i>so bad that you think it should not be allowed</i></p>
            </div>
            <p>disturb /dɪˈstɜːb/ <i>v.</i> 打扰;妨碍</p>
            <div class="bkbj">
              <p>
                <i>to interrupt sb.when they are trying to work,sleep,etc.</i>
              </p>
            </div>
            <p>tendency/ˈtendənsi/ <i>n.</i> (人或物呈现的) 倾向;趋势</p>
            <div class="bkbj">
              <p><i>the way a person or thing tends to be or behave</i></p>
            </div>
            <p>tradition /trəˈdɪʃn/ <i>n.</i> 惯例;传统</p>
            <div class="bkbj">
              <p>
                <i>a belief,custom or way of doing sth.that has existed for a
                  long time</i>
              </p>
            </div>
            <p>barrier /ˈbærɪə(r) / <i>n.</i> 障碍;壁垒</p>
            <div class="bkbj">
              <p>
                <i>a problem,rule or situation that prevents sb.from doing
                  sth.,or that makes sth.impossible; hindrance</i>
              </p>
            </div>
            <p>frustration /frʌˈstreɪʃn/ <i>n.</i> (受) 挫;沮丧</p>
            <div class="bkbj">
              <p><i>the feeling of being frustrated</i></p>
            </div>
            <p>appropriate /əˈprəʊprɪət/ <i>adj.</i> 适当的;合适的</p>
            <div class="bkbj">
              <p><i>suitable,right and proper</i></p>
            </div>
            <p>tone /təʊn/ <i>n.</i> 语气;腔调</p>
            <div class="bkbj">
              <p>
                <i>the quality of sb.’s voice,esp.expressing a particular
                  emotion</i>
              </p>
            </div>
            <p>rewarding /rɪˈwɔːdɪŋ/ <i>adj.</i> 值得做的;令人满意的</p>
            <div class="bkbj">
              <p><i>worth doing; satisfying</i></p>
            </div>
            <div style="display: flex">
              <div class="left" style="width: 48%">
                <p>apply for 申请</p>
                <p>get familiar with 熟悉</p>
                <p>make an effort 努力</p>
              </div>
              <div class="right" style="width: 48%">
                <p>at times 有时;偶尔</p>
                <p>in response to 响应;反应</p>
                <p>take over 控制;管理</p>
              </div>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">23</span>
        </div>
      </div>
    </div>
    <!-- 24 -->
    <div class="page-box" page="30">
      <div v-if="showPageList.indexOf(30) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <div class="bj-note">
              <p><b>Notes:</b></p>
              <p>
                Latvia:拉脱维亚共和国,简称拉脱维亚。位于东欧平原西部、波罗的海东岸,同爱沙尼亚、俄罗斯、白俄罗斯和立陶宛接壤。国土面积64
                589平方千米。
              </p>
            </div>
            <p><b>Ⅰ.Reading comprehension.</b></p>
            <p>A.Read the passage and complete the following mind map.</p>
            <p class="center">
              <img class="img-b" alt="" src="../../assets/images/0034-1.jpg" />
            </p>
            <p>
              B.Decide whether the following statements are true (T) or false
              (F).
            </p>
            <p>
              ( ) 1.An employee is usually defined by his/her talents and
              abilities.
            </p>
            <p>
              ( ) 2.During the interview,I didn’t have difficulty in
              understanding my interviewer.
            </p>
            <p>
              ( ) 3.In Latvia,it is normal to expect replies by email after
              normal working hours.
            </p>
            <p>
              ( ) 4.Learning about your colleagues’ traditions can help you
              move forward.
            </p>
            <p>
              ( ) 5.Email can make the communication more smooth because it
              conveys the emotions.
            </p>
            <p>
              ( ) 6.We can learn a lot from each other when working in a
              cross-cultural environment.
            </p>
            <p><b>Ⅱ.Language focus.</b></p>
            <p>
              A.Fill in the blanks with the proper form of the words given
              below.
            </p>
            <div class="fieldset">
              <p>reward disturb tradition accept colleague arise</p>
            </div>
            <p>
              1.Working with photographers is one of the most ________ parts of
              my job.
            </p>
            <p>2.All families must have ________ that they regularly follow.</p>
            <p>3.Being late is ________ in any working environment.</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">24</span>
        </div>
      </div>
    </div>
    <!-- 25 -->
    <div class="page-box" page="31">
      <div v-if="showPageList.indexOf(31) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              4.Sarah’s ________ Li Lin made her feel welcome on her first day
              at work.
            </p>
            <p>
              5.Problems will ________ from communication between people from
              different cultures.
            </p>
            <p>
              6.I’m sorry to ________ you,but can I talk to you for a moment?
            </p>
            <p>
              B.Underline the following expressions in the passage and make
              sentences with them.
            </p>
            <p>1.apply for____________________________________</p>
            <p>2.in response to________________________________</p>
            <p>3.get familiar with______________________________</p>
            <p>4.take over____________________________________</p>
            <p>5.make an effort________________________________</p>
            <p>C.Translate the following sentences into Chinese.</p>
            <p>
              1.When working in a cross-cultural setting,there can be some
              language barriers among employees.
            </p>
            <p>_____________________________________________</p>
            <p>
              2.You could go for a walk or jog to manage your frustration at
              work.
            </p>
            <p>_____________________________________________</p>
            <p>
              3.They gave us some advice on how to correctly handle cultural
              differences in the workplace.
            </p>
            <p>_____________________________________________</p>
            <p>
              4.Wearing appropriate clothes in the office will make you feel
              comfortable and confident.
            </p>
            <p>_____________________________________________</p>
            <p><b>Ⅲ.Grammar focus:“it” as formal subject.</b></p>
            <p>
              A.Read the example and underline the real subject that “it”
              represents in the following sentences.
            </p>
            <p><b>Example:</b></p>
            <p class="center">
              <img class="img-b" alt="" src="../../assets/images/0035-1.jpg" />
            </p>
            <p>
              1.It is not a secret that a company’s success is heavily based on
              its people.
            </p>
            <p>
              2.It is obvious to all that we should be aware of our body
              language.
            </p>
            <p>3.It can be very different to have a greeting or handshake.</p>
            <p>4.It’s hard to say how long your team meeting should last.</p>
            <p>
              5.It is abnormal to expect replies by email after normal working
              hours.
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">25</span>
        </div>
      </div>
    </div>
    <!-- 26 -->
    <div class="page-box" page="32">
      <div v-if="showPageList.indexOf(32) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>
              B.Read the example and rewrite the following sentences by using
              formal subject “it”.
            </p>
            <p><b>Example:</b></p>
            <div class="fieldset-2">
              <p>
                To misunderstand each other is easy when you speak different
                languages.
              </p>
              <p>
                —It is easy to misunderstand each other when you speak different
                languages.
              </p>
            </div>
            <p>1.To share new ideas with others makes us feel good.</p>
            <p>______________________________________________.</p>
            <p>2.To get along well with colleagues is really important.</p>
            <p>______________________________________________.</p>
            <p>
              3.To have an open mind towards a new culture is necessary in the
              workplace.
            </p>
            <p>_____________________________________________.</p>
            <p>
              4.To think twice before acting is always necessary for everyone.
            </p>
            <p>______________________________________________.</p>
            <p>5.You are very kind to help me with my sales report.</p>
            <p>______________________________________________.</p>
            <h3 id="c013"><span class="bjh3">Mini-project</span></h3>
            <p>
              Most foreigners in China have a hard time keeping up with Chinese
              traditions and culture.In order to get along well with Chinese
              counterparts,it is important for foreign employees to learn
              something about Chinese etiquette.Work in pairs and list the “dos”
              and “don’ts” in Chinese culture.
            </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="wh-no tl-cn">Items</td>
                <td class="wh-no tl-cn">Dos</td>
                <td class="tl-cn">Don’ts</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="wh-no tl-cn">Greeting</td>
                <td class="wh-no tl-cn">
                  Start by addressing the senior frst.
                </td>
                <td>
                  Don't try to reach for a hug when you meetsomeone for the
                  first time.
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Eye Contact</td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td class="wh-no tl-cn">Gift Exchange</td>
                <td>
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td class="wh-no tl-cn">Table Manners</td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">26</span>
        </div>
      </div>
    </div>
    <!-- 27 -->
    <div class="page-box" page="33">
      <div v-if="showPageList.indexOf(34) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>continued</p>
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="wh-no tl-cn">Items</td>
                <td class="wh-no tl-cn">Dos</td>
                <td class="tl-cn">Don’ts</td>
              </tr>
              <tr class="table-tr-bc" style="width: 40%">
                <td class="wh-no tl-cn">Gift Exchange</td>
                <td class="tl-w-45">
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td class="tl-w-45">
                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td class="wh-no tl-cn">Table Manners</td>
                <td class="tl-w-45">
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td class="tl-w-45">
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
            <p class="left">
              <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
            </p>
            <div class="bk-wh">
              <p>
                direct formal respect privacy hand-shaking touch comfortable toast chopsticks seating
                arrangement
              </p>
            </div>
            <h2 id="b006"><img class="img-0" alt="" src="../../assets/images/dy2-le2.jpg" /></h2>
            <h3 id="c014"><span class="bjh3">Warm-up</span></h3>
            <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
              @play="audioPlay"></audio>
            <p><b>Appreciate the theme song of the Beijing</b>2022<b> Winter Olympics<i> Together for a Shared
                  Future</i> and fill in the blanks.</b></p>
            <p class="center"><b><i>Together for a Shared Future</i></b></p>
            <p class="center">There’s a twinkle in your eye</p>
            <p class="center">Reflects the snow that gently covers the tiles</p>
            <p class="center">Fly to the 1._______</p>
            <p class="center">See the world’s new coat of crystal white</p>
            <p class="center">This feeling you just can’t 2._______</p>
            <p class="center">Feels as snow as pure as that azure ice</p>
            <p class="center">Fly to the sky</p>
            <p class="center">Ride the 3._______watch your fears roll by</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">27</span>
        </div>
      </div>
    </div>
    <!-- 28 -->
    <div class="page-box" page="34">
      <div v-if="showPageList.indexOf(34) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p class="center">When everyone needs 4._______</p>
            <p class="center">Let’s go hand in hand and rise above</p>
            <p class="center">Together for a shared future</p>
            <p class="center">You and I</p>
            <p class="center">We can 5._______the sky</p>
            <p class="center">We all know how to love</p>
            <p class="center">Open up your 6._______and that’s enough</p>
            <p class="center">Together for a shared future</p>
            <p class="center">You and I</p>
            <p class="center">Together</p>
            <p class="center">We can touch the sky</p>
            <h3 id="c015"><span class="bjh3">Reading</span></h3>
            <audio :src="resource.readingTwo" controls style="margin-left: 10px" class="audio"
              @play="audioPlay"></audio>
            <p>1.Have you watched the Beijing 2022 Winter Olympics? What did you think of the opening ceremony?</p>
            <p>2.What impressed you most during the Beijing 2022 Winter Olympics?</p>
            <p class="center"><b>From 2008 to 2022:The Road of My Country and My Growth</b></p>
            <p>For an individual or a country,a period of 14 years is long enough to become calm,confident and mature.On
              the road from 2008 to 2022,I learned to grow up with my country and the Olympics.</p>
            <p>In 2008,hosting the Olympics was new to China and I was then new in covering the Olympics as a
              journalist.Seven years later when we won the right to host the Winter Games,I did not think that Beijing
              would be the world’s first city to host both the Summer and Winter Olympics.Now it was real and I was
              simply enjoying the moment.</p>
            <p>Turning up as simple but impressive,the opening ceremony lasted for about two hours with less performing
              artists but more audio-visual technologies to tell the story of “togetherness” rather than introducing
              “myself” 14 years ago at the same sports field.The snowflake-shaped Olympic cauldron,formed by the smaller
              snowflakes with names of the participating countries and regions on them,was lit by two young Chinese
              athletes.</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">28</span>
        </div>
      </div>
    </div>
    <!-- 29 -->
    <div class="page-box" page="35">
      <div v-if="showPageList.indexOf(35) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>As the chief director of the opening ceremony said,2022 would not repeat 2008 though the latter was
              “exceptional”,not only because of the pandemic situation but also a different China now —more confident in
              its culture.</p>
            <p>In the summer 14 years ago,I was like a festivalgoer full of energy rushing for work but also making
              errors.I,like many Chinese fellows,cried after Liu Xiang moved away from the track due to injury.In the
              winter of 2022,I shared my passion in the Olympics in another way —more serious at work,fitter self
              —thanks to regular exercise and a positive view of sports competition.</p>
            <p>It was like getting over my schoolgirl crush and focusing on learning to love.</p>
            <p>I could not agree more with what a gold medal winner said during an interview.“In 2008 we impressed the
              world while in 2022 we became people-centered —for athletes and the people.”</p>
            <p>I failed to control myself the moments when the Chinese national anthem was played and when images of
              people from all walks of life were displayed during the scene of “Paying Tribute to the People”.It is this
              country and its people that made the Olympics happen.I’m as tearful as usual for now I’m deeply in love.
            </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>
            <p>individual /ˌɪndɪˈvɪdʒʊəl/ <i>n.</i> 个人;个体</p>
            <div class="bkbj">
              <p><i>a person considered separately rather than as part of a group</i></p>
            </div>
            <p>mature /məˈtʃʊə/ <i>adj.</i> 成熟的;理智的</p>
            <div class="bkbj">
              <p><i>(of a child or young person) behaving in a sensible way,like an adult</i></p>
            </div>
            <p>journalist /ˈdʒɜːnəlɪst/ <i>n.</i> 新闻记者;报纸撰稿人</p>
            <div class="bkbj">
              <p><i>a person whose job is to collect and write news stories for newspapers,magazines,radio,television or
                  online news sites</i></p>
            </div>
            <p>impressive /ɪmˈpresɪv/ <i>adj.</i> (事物或人) 令人赞叹的;令人敬佩的</p>
            <div class="bkbj">
              <p><i>(of things or people) making you feel admiration,because they are very large,good,skillful,etc.</i>
              </p>
            </div>
            <p>ceremony /ˈserəməni/ <i>n.</i> 仪式;典礼</p>
            <div class="bkbj">
              <p><i>a public or religious occasion that includes a series of formal or traditional actions</i></p>
            </div>
            <p>audio-visual <i>adj.</i> 视听的</p>
            <div class="bkbj">
              <p><i>involving both hearing and seeing</i></p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">29</span>
        </div>
      </div>
    </div>
    <!-- 30 -->
    <div class="page-box" page="36">
      <div v-if="showPageList.indexOf(36) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>snowflake /ˈsnəʊfleɪk/ <i>n.</i> 雪花</p>
            <div class="bkbj">
              <p><i>a small soft piece of frozen water that falls from the sky as snow</i></p>
            </div>
            <p>cauldron /ˈkɔːldrən/ <i>n.</i> 大锅</p>
            <div class="bkbj">
              <p><i>a large deep pot for boiling liquids or cooking food over a fire</i></p>
            </div>
            <p>participate /pɑːˈtɪsɪpeɪt/ <i>v.</i> 参加;参与</p>
            <div class="bkbj">
              <p><i>to take part in or become involved in an activity</i></p>
            </div>
            <p>exceptional /ɪkˈsepʃənl/ <i>adj.</i> 非凡的;卓越的</p>
            <div class="bkbj">
              <p><i>unusually good; outstanding</i></p>
            </div>
            <p>pandemic /pænˈdemɪk/ <i>adj</i>./<i>n.</i> 全国或全世界流行的(疾病)</p>
            <div class="bkbj">
              <p><i>a disease that spreads over a whole country or the whole world</i></p>
            </div>
            <p>festivalgoer /ˈfestəvlˌɡəʊə/ <i>n.</i> 参加节日活动者</p>
            <div class="bkbj">
              <p><i>an attender of a festival</i></p>
            </div>
            <p>track /træk/ <i>n.</i> 跑道</p>
            <div class="bkbj">
              <p><i>a piece of ground that is used for races involving running</i></p>
            </div>
            <p>competition /ˌkɒmpəˈtɪʃn/ <i>n.</i> 竞赛;竞争</p>
            <div class="bkbj">
              <p><i>an event in which people compete with each other to find out who is the best at sth.</i></p>
            </div>
            <p>impress /ɪmˈpres/ <i>v.</i> 给予某人深刻印象</p>
            <div class="bkbj">
              <p><i>to have a favourable effect on sb.</i></p>
            </div>
            <p>anthem /ˈænθəm/ <i>n</i>.国歌</p>
            <div class="bkbj">
              <p><i>a song that has a special importance for a country</i></p>
            </div>
            <div style="display: flex">
              <div class="left" style="width: 48%">
                <p>move away 移开</p>
                <p>focus on ...聚焦于……</p>
                <p>pay tribute to ...向……致敬</p>
              </div>
              <div class="right" style="width: 48%">
                <p>due to 由于</p>
                <p>fail to do ...未能做……</p>
              </div>
            </div>
            <p><b>Ⅰ.Reading comprehension.</b></p>
            <p>A.Read the passage and answer the following questions.</p>
            <p>1.What was the theme of the Beijing 2022 Winter Olympics?</p>
            <p>______________________________________________</p>
            <p>2.What made the Beijing 2022 Winter Olympics “exceptional”?</p>
            <p>______________________________________________</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">30</span>
        </div>
      </div>
    </div>
    <!-- 31 -->
    <div class="page-box" page="37">
      <div v-if="showPageList.indexOf(37) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>3.How does the author feel about China holding two Olympic Games?</p>
            <p>______________________________________________</p>
            <p>B.Read the author’s opinions of the two Olympics,and put the number of the sentence into the right
              column.</p>
            <p>1.I was full of energy rushing for work but also making errors.</p>
            <p>2.I was more serious at work and my body became fitter.</p>
            <p>3.I cried after Liu Xiang moved away off the track due to injury.</p>
            <p>4.I couldn’t control myself when the Chinese anthem was played.</p>
            <p>5.More audio-visual technologies were used in the opening ceremony.</p>
            <p>6.It focused more on introducing “myself” instead of telling the story of “togetherness”.</p>
            <p class="center"><img class="img-a" alt="" src="../../assets/images/0041-1.jpg" /></p>
            <p><b>Ⅱ.Language focus.</b></p>
            <p>A.Replace the words or expressions in italics with the exact words in the passage and change the form if
              necessary.</p>
            <p>1.Each <i>person</i> has a particular job within the company._________</p>
            <p>2.Lin Wei showed <i>excellent</i> mechanic skills as an auto technician._________</p>
            <p>3.As a team member,I always <i>take part</i> in the discussions as much as possible._________</p>
            <p>4.She was the winner of the business plan <i>contest</i> in my company._________</p>
            <p>5.He is a good <i>reporter</i> who is curious about new information every time._________</p>
            <p>B.Fill in the blanks with the proper form of the expressions given below.</p>
            <div class="bk-wh">
              <p>fail to focus on due to move away pay tribute to</p>
            </div>
            <p>1.The delivery man was praised by us ________ his positive attitude.</p>
            <p>2.The manager basically ________ cost reduction and quality improvement.</p>
            <p>3.Li Ming ________ control his emotions when he saw the Chinese flag flying at the Olympic Stadium.</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">31</span>
        </div>
      </div>
    </div>
    <!-- 32 -->
    <div class="page-box" page="38">
      <div v-if="showPageList.indexOf(38) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p>4.The boss ________ what she had done for the company.</p>
            <p>5.To be creative,we’d better ________ from traditional ideas at work.</p>
            <p><b>Ⅲ.Grammar focus:Active and passive voice.</b></p>
            <p>Complete the passage using the correct form of the verbs in the brackets.</p>
            <p>Fashion designer Vivienne Tam 1. ________ (name) “Yin Yok” when she was born.She was given her English
              name when she started studying in Hong Kong.Her teacher 2. ________ (teach) English at school but she
              spoke Chinese at home.Her parents 3. ________ (tell) her to remember Chinese culture.At the same
              time,Western ideas 4. ________ (introduce) to her since people from many cultures were living in Hong
              Kong.This mix of East and West in her life 5. ________ (see) in her designs even now.Vivienne 6. ________
              (move) to New York when she was twenty-five.Her new and interesting designs were liked by important shops
              there,so a lot of orders for her clothing 7 ________ (place).Today she 8. ________ (sell) East-meets-West
              clothes not only in New York,but also in cities around the world.</p>
            <h3 id="c016"><span class="bjh3">Mini-project</span></h3>
            <p>China has a history of over 5,000 years with rich cultural heritage and great achievements that have
              drawn admiration from around the world.There are plenty of good reasons to be proud of her.List the things
              you love about China and explain your reasons.</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">Items</td>
                <td class="tl-cn">Reasons</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Chinses Music</td>
                <td>
                  I am fond of Chinese folk songs. They are inspired by everyday life of Chinese peopleand are passed
                  down from generation to generation.
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Chinses Art</td>
                <td>
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></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>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">32</span>
        </div>
      </div>
    </div>
    <!-- 33 -->
    <div class="page-box" page="39">
      <div v-if="showPageList.indexOf(39) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p class="mr-rg">continued</p>
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn">Items</td>
                <td class="tl-cn">Reasons</td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td style="width: 90%;">
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.sex" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td style="width: 90%;">
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
            <h2 id="b007"><img class="img-0" alt="" src="image/dy2-le3.jpg" /></h2>
            <h3 id="c017"><span class="bjh3">Listening</span></h3>
            <p><b>Ⅰ.Listen to the introduction to Cultural Diversity Day and fill in the following blanks.</b></p>
            <audio :src="resource.listenOne" controls class="audio" @play="audioPlay"></audio>
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn" colspan="2">Cultural Diversity Day</td>
              </tr>
              <tr class="table-tr-bc">
                <td>When is it?</td>
                <td>1.On_______21st</td>
              </tr>
              <tr class="table-tr-bc">
                <td>Why do we celebrate it?</td>
                <td>Recognizing cultural 2._______
                  Understanding the concept of culture.
                  Getting to know each other through the differences in language,3._______race,
                  religion and other elements.
                  Giving people a sense of 4._______in their own culture.
                  .Leading to community 5._______and personal growth.</td>
              </tr>
            </table>
            <p><b>Ⅱ.Listen to the conversation and mark the activities when mentioned.</b></p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
              Lecture on Ancient Chinese History</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Calligraphy &amp;
              Painting Demonstration</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Traditional Chinese
              Music</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Sichuan Opera</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Chinese Cuisine</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Tea Ceremony</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Tai Chi</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Traditional Chinese
              Medicine</p>
            <p><input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />Traditional Chinese
              Crafts</p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">33</span>
        </div>
      </div>
    </div>
    <!-- 34 -->
    <div class="page-box" page="40">
      <div v-if="showPageList.indexOf(40) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <h3 id="c018"><span class="bjh3">Practical Writing</span></h3>
            <p>Work with your partner to discuss the following questions.</p>
            <p>1.Why is a schedule important for everyone attending the event?</p>
            <p>2.What are the elements of a schedule?</p>
            <p><b>Ⅰ.Read the following tips for making a schedule of an event and find out how you can improve your
                schedule.</b></p>
            <p>An event schedule is a document that organizers provide for the attendees and participants.It usually
              includes the general direction and landmarks of the event venue,which helps people figure out where and
              when they are going.</p>
            <div class="fieldset">
              <p>◆ Use a table for your schedule to keep your content organized.</p>
              <p>◆ Make it short and specific.</p>
              <p>◆ Be realistic about how much you want to accomplish in one day.</p>
              <p>◆ Add a time allowance to your plans for unexpected events.</p>
              <p class="center"><img class="img-h" alt="" src="../../assets/images/0044-1.jpg" /></p>
            </div>
            <p><b>Ⅱ.Read the schedule of Chinese Culture Week</b>2023<b> and fill in the blanks by translating the
                Chinese in the brackets.</b></p>
            <p class="center"><img class="img-a" alt="" src="../../assets/images/0044-2.jpg" /></p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">34</span>
        </div>
      </div>
    </div>
    <!-- 35 -->
    <div class="page-box" page="41">
      <div v-if="showPageList.indexOf(41) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <p><b>Ⅲ.Malaysian student Andy writes an email to his Chinese friend Wang Hua about his trip to
                China.Complete the schedule of his visit to Chengdu with the information from the email.</b></p>
            <p class="center"><img class="img-0" alt="" src="../../assets/images/0045-2.jpg" /></p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">35</span>
        </div>
      </div>
    </div>
    <!-- 36 -->
    <div class="page-box" page="42">
      <div v-if="showPageList.indexOf(42) > -1">
        <!-- 头部 -->
        <div class="w100 mb-20" style="padding-right: 20px">
          <div class="event-header-bc-unit2 fl al-end" style="height: 100px; padding-left: 40px">
            <div class="preface-header-box event-header-text-bc-unit2">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color-unit2">基础模块一</span>
            </div>
          </div>
        </div>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn">Day</td>
                <td class="wh-no tl-cn">Events/Activities</td>
                <td class="tl-cn">Place</td>
              </tr>
              <tr class="table-tr-bc">
                <td>1._________</td>
                <td>Attend the festival activities</td>
                <td>
                  The International Intangible Cultural Heritage Park
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>Wednesday</td>
                <td>Climb the mountain</td>
                <td>
                  2.___________
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>Thursday</td>
                <td>Visit attractions in the downtown
                  3.____________ </td>
                <td>
                  Wuhou Temple & Jinsha Site MuseumShunxing Tea House
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>Friday</td>
                <td> 4.____________ Buy souvenirs</td>
                <td>
                  Panda Base 5.____________
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>Saturday</td>
                <td>6.___________</td>
                <td>
                  Shuangliu International Airport
                </td>
              </tr>
            </table>
            <p>Ⅳ.<b>A delegation from Chiang Mai University is going to visit your college from December</b> 10-12<b> to
                promote Chinese language teaching and cultural exchange in Thailand.Arrange a three-day schedule for the
                delegation including the activities below.</b></p>
            <p>l Visit the college history museum</p>
            <p>l Have a meeting with the director of International Exchange and Cooperation Department</p>
            <p>l Sign an agreement on the student-exchange program</p>
            <p>l Attend a welcome party</p>
            <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
              <tr class="table-th-bc">
                <td class="tl-cn" colspan="4">Schedule for Chiang Mai UniversityDelegation's Visit</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Date</td>
                <td class="tl-cn">Time</td>
                <td class="tl-cn">Activities</td>
                <td class="tl-cn">Place</td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td >
                  <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">36</span>
        </div>
      </div>
    </div>
    <!-- 37 -->
    <div class="page-box" page="43">
      <div v-if="showPageList.indexOf(43) > -1">
        <!-- 头部 -->
        <ul class="preface-odd-header w100 fl ju-bt">
          <li class=""></li>
          <li class="fz-18">
            <span class="chapter-left-bc-unit2">MODULE 2</span>
            <span class="chapter-right-bc-unit2 fw-bl chapter-right-cl-unit2">GOING GLOBAL</span>
          </li>
        </ul>
        <!-- 内容 -->
        <div class="padding-93">
          <div class="bodystyle">
            <div class="un-h2">
              <h2 id="b008">Unit Project</h2>
            </div>
            <p>International Sister City Week will be celebrated in your hometown.Participants of sister cities from
              other countries will join the event to promote exchange and expand communication with your
              hometown.Arrange a three-day event schedule for your guests.</p>
            <p>Step 1: Work in groups of five.</p>
            <p>Step 2: Discuss what activities will be held during the event. (For reference: welcome banquet,
              round-table meeting, cultural forum, performances, photo shows,etc.)</p>
            <p>Step 3: Make an event schedule for the participants.</p>
            <p>Step 4: Present your arrangement to the class.</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" colspan="4">Schedule</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Date</td>
                <td class="tl-cn">Time</td>
                <td class="tl-cn">Activities</td>
                <td class="tl-cn">Place</td>
              </tr>
              <tr class="table-tr-bc">
                <td rowspan="3">
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></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>
                </td>
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td rowspan="3">
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></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>
                </td>
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td rowspan="3">
                  <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></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>
                </td>
                <td>
                  <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
              <tr class="table-tr-bc">
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
                <td>
                  <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
                    @change="setBookQuestion"></textarea>
                </td>
              </tr>
            </table>
            <div class="fieldset">
              <p class="center"><b>Useful Expressions for Making Arrangements</b></p>
              <p><b>Activities</b>: welcome banquet,round-table meeting,cultural forum,folk culture performances,city
                photos show …</p>
              <p><b>Local highlights</b>:(take Beijing for example) climbing the Great Wall,visiting the Forbidden
                City,tasting Beijing roast duck,enjoying Peking opera,exploring the old alleys …</p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">37</span>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import matching from "@/components/matching/matching.vue";
import { getResourcePath } from "@/assets/methods/resources";
export default {
  name: "chapter-two",
  components: { matching },
  props: {
    showPageList: {
      type: Array,
    },
  },
  data() {
    return {
      imgThirteen: require("../../assets/images/grammar.jpg"),
      showAnswerOne: false,
      showAnswerTwo: false,
      showAnswerThree: false,
      showAnswerFour: false,
      showAnswerFive: false,
      showImg: false,
      showQuestionAnswer: false,
      rawData: {
        left: [
          {
            oldId: "FB34",
            txt: "Martin    Silk",
          },
          {
            oldId: "64D6",
            txt: "Jessica  The Great Wall",
          },
          {
            oldId: "2ED4",
            txt: "Soren  Chinese Food",
          },
          {
            oldId: "44DE",
            txt: "Chinese    Tea",
          },
        ],
        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.",
          },
          {
            oldId: "44DE",
            txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
          },
        ],
      },
      value: [],
      question: {
        KnowledgePoint: "123",
        analysis: "123",
        answer: [
          {
            id: "FB34",
            linkValue:
              "The clothing material is quite popular among Roman women inancient times.",
            value: "Silk",
          },
          {
            id: "64D6",
            linkValue:
              "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
            value: "The Great Wall",
          },
          {
            id: "2ED4",
            linkValue:
              "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
            value: "Chinese Food",
          },
          {
            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",
          },
        ],
        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: "44DE",
              txt: "It was first discovered and drank in China and my favoriteLongjing tea is produced near the West Lake in Hangzhou.",
            },
            {
              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.",
            },
          ],
          values: [
            {
              oldId: "FB34",
              txt: "Martin  Silk",
            },
            {
              oldId: "64D6",
              txt: "The Great Wall",
            },
            {
              oldId: "2ED4",
              txt: "Chinese Food",
            },
            {
              oldId: "44DE",
              txt: "Chinese Tea",
            },
          ],
        },
        questionType: "matching",
        stem: {
          stemTxt: "按顺序连线",
        },
        stemStyle: undefined,
        titleDescription: "1",
        userChoise: [],
        value: [],
        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: "",
        },
        table: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
          six: "",
          seven: "",
          enight: "",
          nine: "",
        },
      },
      testData: {
        check: [],
        tx: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        in: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        line: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        ts: {
          one: "",
          two: "",
          three: "",
          four: "",
        },
        gr: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        cm: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
      },
      resource: {
        listenOne: "",
        readingOne: "",
        readingTwo: "",
      },
      dropDownList: [
        "online shopping",
        "facial recognition",
        "electronic payment",
        "intercity train",
        "shared bike",
        "take-away service",
      ],
      dropdownData: {
        one: {
          value: "",
          isRight: null,
          answer: "intercity train",
        },
        two: {
          value: "",
          isRight: null,
          answer: "online shopping",
        },
        three: {
          value: "",
          isRight: null,
          answer: "electronic payment",
        },
        four: {
          value: "",
          isRight: null,
          answer: "shared bike",
        },
        five: {
          value: "",
          isRight: null,
          answer: "take-away service",
        },
        six: {
          value: "",
          isRight: null,
          answer: "facial recognition",
        },
      },
    };
  },
  mounted() {
    const testData = localStorage.getItem("english-testOne");
    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);
    }
    this.getPath();
  },
  methods: {
    saveWord(event, word) {
      this.$emit("saveCharacters", event, word);
    },
    setTestData() {
      localStorage.setItem("english-testOne", JSON.stringify(this.testData));
    },
    changeTestData() {
      localStorage.removeItem("english-testOne");
      this.testData = {
        check: [],
        tx: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        in: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        line: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        ts: {
          one: "",
          two: "",
          three: "",
          four: "",
        },
        gr: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
        cm: {
          one: "",
          two: "",
          three: "",
          four: "",
          five: "",
        },
      };
    },
    setBookQuestion() {
      console.log("保存");
      localStorage.setItem(
        "english-book-question-one",
        JSON.stringify(this.questionData)
      );
    },
    async getPath() {
      this.resource.listenOne = await getResourcePath(
        "422139A2EF66EA888C5ED1D550AE23E0"
      );
      this.resource.readingOne = await getResourcePath(
        "3F442B682D84C8AB06C800B29D734920"
      );
      this.resource.readingTwo = await getResourcePath(
        "E8719EC88026BCFB11D292AA999F6D3D"
      );
    },
    showAnswer(type) {
      if (type == "showImg") {
        this.showImg = !this.showImg;
      }
    },
    handleQuestion(type) {
      if (type == "one") {
        this.questionData.warnUp.one.value
          ? (this.questionData.warnUp.one.isRight =
            this.questionData.warnUp.one.value == "Chinese knot")
          : (this.questionData.warnUp.one.isRight = null);
      } else if (type == "two") {
        this.questionData.warnUp.two.value
          ? (this.questionData.warnUp.two.isRight =
            this.questionData.warnUp.two.value == "Chinese medicine")
          : (this.questionData.warnUp.two.isRight = null);
      } else if (type == "three") {
        this.questionData.warnUp.three.value
          ? (this.questionData.warnUp.three.isRight =
            this.questionData.warnUp.three.value == "Chinese calligraphy")
          : (this.questionData.warnUp.three.isRight = null);
      } else if (type == "four") {
        this.questionData.warnUp.four.value
          ? (this.questionData.warnUp.four.isRight =
            this.questionData.warnUp.four.value == "Taichi")
          : (this.questionData.warnUp.four.isRight = null);
      } else if (type == "five") {
        this.questionData.warnUp.five.value
          ? (this.questionData.warnUp.five.isRight =
            this.questionData.warnUp.five.value == "sweet dumpling")
          : (this.questionData.warnUp.five.isRight = null);
      } else if (type == "six") {
        this.questionData.warnUp.six.value
          ? (this.questionData.warnUp.six.isRight =
            this.questionData.warnUp.six.value == "Chinese chess")
          : (this.questionData.warnUp.six.isRight = null);
      }
    },
    handleDropdown(type) {
      const dropdownDatas = this.dropdownData;
      for (let key in dropdownDatas) {
        const item = dropdownDatas[key];
        if (type == "judge") {
          item.value == item.answer
            ? (item.isRight = true)
            : (item.isRight = false);
          console.log(item.value, item.answer);
        }
      }
      this.dropdownData = dropdownDatas;
    },
    changeDropdown() {
      localStorage.removeItem("english-dropdown-one");
      for (let key in this.dropdownData) {
        const item = this.dropdownData[key];
        item.value = "";
        item.isRight = null;
      }
    },
    setDropdownData() {
      localStorage.setItem(
        "english-dropdown-one",
        JSON.stringify(this.dropdownData)
      );
    },
    saveData() {
      console.log(this.testData);
    },
    audioPlay() {
      this.$emit("closeMiniAudio");
    },
  },
};
</script>
<style lang="less" scoped>
p {
  font-size: 16px !important;
}
.bodystyle {
  margin: 0 !important;
}
.line-border-box {
  margin-left: 10px;
  display: inline-block;
  width: 50%;
  height: 3px;
  background-color: #f9a71b;
}
.mr-20 {
  margin-right: 20px;
}
.dl-box {
  display: flex;
  flex-wrap: wrap;
  .dl-span {
    display: inline-block;
    text-indent: 0;
    margin-bottom: 15px;
    height: 20px;
    line-height: 20px;
  }
}
.btn-w {
  font-size: 14px;
  border-width: 1px;
  min-width: 80px;
  height: 30px;
  background-color: #fff;
  &:hover {
    background-color: #0bab87;
    color: #fff;
  }
}
.banshi {
  position: relative;
  margin-top: 40px;
  width: 100%;
  height: 350px;
  margin: 0 auto;
}
.pageBox {
  z-index: 9999999999;
  color: #999;
  position: absolute;
  left: 48%;
  bottom: 0px;
}
select {
  height: 24px;
}
.mini-audio {
  width: 200px;
  height: 200px;
  position: fixed;
  right: 0;
  background-color: red;
}
</style>
src/books/English/view/components/chapter003.vue
New file
@@ -0,0 +1,1806 @@
<template>
    <div class="chapter" num="4"> <!-- 下一个单元 -->
        <!-- 38 -->
        <div class="page-box" page="44">
            <div class="bodystyle" v-if="showPageList.indexOf(44) > -1">
                <h1 id="a005">
                    <img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
                </h1>
                <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>➢ Ask for clarification politely</p>
                <p>➢ Be able to fill in the profile properly</p>
                <p>➢ Get ready to volunteer</p>
                <p class="center">
                    <img class="img-0" alt="" src="../../assets/images/0048-1.jpg" />
                </p>
                <p class="img"></p>
            </div>
        </div>
        <!-- 39 -->
        <div class="page-box" page="45">
            <div v-if="showPageList.indexOf(45) > -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">
                        <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>
                        <div class="bk-wh">
                            <p>animal rescue and care blood donation community clean-ups language service</p>
                        </div>
                        <div class="openImgBox">
                            <div class="fl ju-bt">
                                <div class="left" style="width: 48%">
                                    <div>
                                        <p class="center">
                                            <img src="../../assets/images/0049-2.jpg" alt="" class="w100" />
                                        </p>
                                        <p class="center">
                                            1.
                                            <select v-model="dropdownData.one.value">
                                                <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>
                                        </p>
                                    </div>
                                    <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                                        答案:blood donation
                                    </p>
                                </div>
                                <div class="right" style="width: 48%">
                                    <div>
                                        <p class="center">
                                            <img src="../../assets/images/0049-3.jpg" alt="" style="width: 98%" />
                                        </p>
                                        <p class="center">
                                            2.
                                            <select v-model="dropdownData.two.value">
                                                <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>
                                        </p>
                                    </div>
                                    <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                                        答案:language service
                                    </p>
                                </div>
                            </div>
                            <div class="fl ju-bt">
                                <div class="left" style="width: 48%">
                                    <div>
                                        <p class="center">
                                            <img src="../../assets/images/0049-4.jpg" alt="" style="width: 98%" />
                                        </p>
                                        <p class="center">
                                            3.
                                            <select v-model="dropdownData.three.value">
                                                <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>
                                        </p>
                                    </div>
                                    <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                                        答案:community clean-ups
                                    </p>
                                </div>
                                <div class="right" style="width: 48%">
                                    <div>
                                        <p class="center">
                                            <img src="../../assets/images/0049-5.jpg" alt="" style="width: 94%" />
                                        </p>
                                        <p class="center">
                                            4.
                                            <select v-model="dropdownData.four.value">
                                                <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>
                                        </p>
                                    </div>
                                    <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
                                        答案:animal rescue and care
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="w100 fl ju-cn">
                            <div class="fl ju-ev mt-40" style="width: 80%">
                                <button class="btn-border btn-w" @click="handleDropdown('judge')">
                                    提交
                                </button>
                                <button @click="setDropdownData" class="btn-border btn-w">
                                    保存
                                </button>
                                <button class="btn-border btn-w" @click="changeDropdown">
                                    重做
                                </button>
                                <button @click="showAnswerFive = !showAnswerFive" class="parimary-btn">
                                    查看答案
                                </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>
                            </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>
                        </div>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">39</span>
                </div>
            </div>
        </div>
        <!-- 40 -->
        <div class="page-box" page="46">
            <div v-if="showPageList.indexOf(46) > -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 style="display: flex">
                            <div class="left" style="width: 55%; margin-top: 11%;">
                                <p>2.Who are more likely to be volunteers?</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>
                        </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>
                            <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>
                        </div>
                        <h3 id="c021"><span class="bjh3">Reading</span></h3>
                        <p>1.As the saying goes,“The rose is in her hand,the flavor in mine.” What’s 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’re considering a new career,volunteering can help you get experience in your area of
                            interest and meet people in the field.Even if you’re 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’ve developed these qualities and
                            skills in a volunteer position first.</p>
                    </div>
                    <div>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">40</span>
                </div>
            </div>
        </div>
        <!-- 41 -->
        <div class="page-box" page="47">
            <div v-if="showPageList.indexOf(47) > -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">
                        <p>What’s 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>
                        <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>
                        <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>
                        </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>
                        </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>
                        </div>
                        <p>meaningful /ˈmiːnɪŋfl/ <i>adj.</i> 重要的;严肃的</p>
                        <div class="bkbj">
                            <p><i>serious and important</i></p>
                        </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>
                        </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>
                        </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>
                        </div>
                        <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>
                        <p>commitment /kəˈmɪtmənt/ <i>n.</i> 承诺;许诺</p>
                        <div class="bkbj">
                            <p><i>a promise to do sth.or to behave in a particular way</i></p>
                        </div>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">41</span>
                </div>
            </div>
        </div>
        <!-- 42 -->
        <div class="page-box" page="48">
            <div v-if="showPageList.indexOf(48) > -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">
                        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>
                        </div>
                        <p>vision /ˈvɪʒn/ <i>n.</i> 视野</p>
                        <div class="bkbj">
                            <p><i>the area that you can see from a particular position</i></p>
                        </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>
                        </div>
                        <div style="display: flex;">
                            <div class="left" style="width: 45%;">
                                <p>help out 帮助解决难题;救出</p>
                                <p>stretch one’s wings 大展拳脚</p>
                            </div>
                            <div class="right" style="width: 55%;">
                                <p>make a difference 有影响;有关系</p>
                                <p>what’s 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’t volunteer?</p>
                        <p>a.People are too busy to volunteer.</p>
                        <p>b.People can’t 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’s mental health.</p>
                        <p>3.In what way can volunteering help with one’s career development?</p>
                        <p>a.Providing one with a new career.</p>
                        <p>b.Helping to arouse one’s interests.</p>
                        <p>c.Offering an opportunity to practice working skills.</p>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">42</span>
                </div>
            </div>
        </div>
        <!-- 43 -->
        <div class="page-box" page="49">
            <div v-if="showPageList.indexOf(49) > -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">
                        <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’s 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’s
                            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’s wings________________________________</p>
                        <p>4.what’s 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>
                        <p>_______________________________________________________</p>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">43</span>
                </div>
            </div>
        </div>
        <!-- 44 -->
        <div class="page-box" page="50">
            <div v-if="showPageList.indexOf(50) > -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">
                        <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>
                        <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>
                        <div class="fieldset-2">
                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0054-1.jpg" /></p>
                            <p>志愿者正在辅导孩子们做功课。</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                        </div>
                        <div class="fieldset-2">
                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0054-2.jpg" /></p>
                            <p>学生们正在帮忙做农活。</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                        </div>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">44</span>
                </div>
            </div>
        </div>
        <!-- 45 -->
        <div class="page-box" page="51">
            <div v-if="showPageList.indexOf(51) > -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 class="fieldset-2">
                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0055-1.jpg" /></p>
                            <p>志愿者正在沙滩上清理垃圾。</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                        </div>
                        <div class="fieldset-2">
                            <p class="center"><img class="img-e" alt="" src="../../assets/images/0055-2.jpg" /></p>
                            <p>志愿者正在进行衣物捐赠活动。</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                            <p>_______________________________________________</p>
                        </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>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>
                        </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">The Volunteer Work</td>
                                <td class="tl-cn">The Feelings</td>
                                <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>
                            </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>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.four"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">45</span>
                </div>
            </div>
        </div>
        <!-- 46 -->
        <div class="page-box" page="52">
            <div v-if="showPageList.indexOf(52) > -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">
                        <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>
                                <td class="tl-cn">The Feelings</td>
                                <td class="tl-cn">The Benefits</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>
                                </td>
                                <td style="width: 40%;">
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></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>
                            </tr>
                            <tr class="table-tr-bc">
                                <td>
                                    <textarea v-model="questionData.table.six"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.seven"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.enight"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </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>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.four"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></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>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.seven"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.enight"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                            </tr>
                        </table>
                        <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>
                        </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>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">46</span>
                </div>
            </div>
        </div>
        <!-- 47 -->
        <div class="page-box" page="53">
            <div v-if="showPageList.indexOf(53) > -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">
                        <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 class="center"><b>How to Light Up the World</b></p>
                        <p>(Excerpted from the speech “Learning 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’ve 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>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">47</span>
                </div>
            </div>
        </div>
        <!-- 48 -->
        <div class="page-box" page="54">
            <div v-if="showPageList.indexOf(54) > -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">
                        <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,“If you go for training,don’t 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,“Please come back to me.” But she says,“No,I’m 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,“What do
                            you think you’re doing? You should be sitting with the women.” And she said quietly,“Today 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’s 47 least developed countries with Barefoot
                            College–trained 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’ll end the passage with a quotation from Gandhi:“First they ignore 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>
                        <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> 解决办法</p>
                        <div class="bkbj">
                            <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>
                        </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>
                        </div>
                        <p>solar /ˈsəʊlə(r)/ <i>adj.</i> 太阳能的</p>
                        <div class="bkbj">
                            <p><i>using the sun’s energy</i></p>
                        </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>
                        </div>
                        <p>primarily /praɪˈmerəli/ <i>adv.</i> 主要地</p>
                        <div class="bkbj">
                            <p><i>mainly</i></p>
                        </div>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">48</span>
                </div>
            </div>
        </div>
        <!-- 49 -->
        <div class="page-box" page="55">
            <div v-if="showPageList.indexOf(55) > -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">
                        <p>attend /əˈtend/ <i>v.</i> 参加</p>
                        <div class="bkbj">
                            <p><i>to be present at an event</i></p>
                        </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>
                        </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>
                        </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>
                        </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>
                        </div>
                        <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%;">
                                <p>go over (to ...) 从一处到(另一处)</p>
                                <p>be faced with sth.面临,必须对付(某情况)</p>
                            </div>
                        </div>
                        <div class="bj-note">
                            <p><b>Notes:</b></p>
                            <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>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">49</span>
                </div>
            </div>
        </div>
        <!-- 50 -->
        <div class="page-box" page="56">
            <div v-if="showPageList.indexOf(56) > -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">
                        <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>
                        <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>
                        </div>
                        <p>1.After watching the news,he ________ the idea to support the little girl’s education.</p>
                        <p>2.Many Irish people ________ America during the famine (饥荒时期).</p>
                        <p>3.They ________ the play ________ a song.</p>
                        <p>4.The teacher’s smiles ________ the boy’s 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>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>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">50</span>
                </div>
            </div>
        </div>
        <!-- 51 -->
        <div class="page-box" page="57">
            <div v-if="showPageList.indexOf(57) > -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">
                        <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’s 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>
                        <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>
                            </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>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                            </tr>
                            <tr class="table-tr-bc">
                                <td>
                                    <textarea v-model="questionData.table.two"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </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>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                            </tr>
                            <tr class="table-tr-bc">
                                <td>
                                    <textarea v-model="questionData.table.two"
                                        class="w100 table-tr-bc b0 table-textarea textarea-box"
                                        @change="setBookQuestion"></textarea>
                                </td>
                                <td>
                                    <textarea v-model="questionData.table.three"
                                        class="w100 table-tr-bc b0 table-textarea" @change="setBookQuestion"></textarea>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">51</span>
                </div>
            </div>
        </div>
        <!-- 52 -->
        <div class="page-box" page="58">
            <div v-if="showPageList.indexOf(58) > -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">
                        <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’ve lived in Beijing for 24 years and I’m_________from the United States.My name is
                            Terry.I’m 64 years old and I’m_________.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’s 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’s his understanding of the volunteering spirit?</p>
                        <p>_________________________________________________________</p>
                    </div>
                </div>
                <div class="preface-bottom">
                    <span class="contet-num-box">52</span>
                </div>
            </div>
        </div>
        <!-- 53 -->
        <div class="page-box" page="59">
            <div v-if="showPageList.indexOf(59) > -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">53</span>
                </div>
            </div>
        </div>
        <!-- 54 -->
        <div class="page-box" page="60">
            <div v-if="showPageList.indexOf(60) > -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>
        <!-- 55 -->
        <div class="page-box" page="61">
            <div v-if="showPageList.indexOf(61) > -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>
        <!-- 56 -->
        <div class="page-box" page="62">
            <div v-if="showPageList.indexOf(62) > -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>
        <!-- 57 -->
        <div class="page-box" page="63">
            <div v-if="showPageList.indexOf(63) > -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>
        <!-- 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>
                <div class="preface-bottom">
                    <span class="contet-num-box">12</span>
                </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>
    </div>
</template>
<script>
import matching from "@/components/matching/matching.vue";
import { getResourcePath } from "@/assets/methods/resources";
export default {
    name: "chapter-three",
    components: { matching },
    props: {
        showPageList: {
            type: Array,
        },
    },
    data() {
        return {
            imgThirteen: require("../../assets/images/grammar.jpg"),
            showAnswerOne: false,
            showAnswerTwo: false,
            showAnswerThree: false,
            showAnswerFour: false,
            showAnswerFive: false,
            showImg: false,
            showQuestionAnswer: false,
            rawData: {
                left: [
                    {
                        oldId: "FB34",
                        txt: "Martin    Silk",
                    },
                    {
                        oldId: "64D6",
                        txt: "Jessica  The Great Wall",
                    },
                    {
                        oldId: "2ED4",
                        txt: "Soren  Chinese Food",
                    },
                    {
                        oldId: "44DE",
                        txt: "Chinese    Tea",
                    },
                ],
                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.",
                    },
                    {
                        oldId: "44DE",
                        txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
                    },
                ],
            },
            value: [],
            question: {
                KnowledgePoint: "123",
                analysis: "123",
                answer: [
                    {
                        id: "FB34",
                        linkValue:
                            "The clothing material is quite popular among Roman women inancient times.",
                        value: "Silk",
                    },
                    {
                        id: "64D6",
                        linkValue:
                            "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
                        value: "The Great Wall",
                    },
                    {
                        id: "2ED4",
                        linkValue:
                            "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
                        value: "Chinese Food",
                    },
                    {
                        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",
                    },
                ],
                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: "44DE",
                            txt: "It was first discovered and drank in China and my favoriteLongjing tea is produced near the West Lake in Hangzhou.",
                        },
                        {
                            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.",
                        },
                    ],
                    values: [
                        {
                            oldId: "FB34",
                            txt: "Martin  Silk",
                        },
                        {
                            oldId: "64D6",
                            txt: "The Great Wall",
                        },
                        {
                            oldId: "2ED4",
                            txt: "Chinese Food",
                        },
                        {
                            oldId: "44DE",
                            txt: "Chinese Tea",
                        },
                    ],
                },
                questionType: "matching",
                stem: {
                    stemTxt: "按顺序连线",
                },
                stemStyle: undefined,
                titleDescription: "1",
                userChoise: [],
                value: [],
                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: "",
                },
                table: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                    six: "",
                    seven: "",
                    enight: "",
                    nine: "",
                },
            },
            testData: {
                check: [],
                tx: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                in: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                line: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                ts: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                },
                gr: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                cm: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
            },
            resource: {
                listenOne: "",
                readingOne: "",
                readingTwo: "",
            },
            dropDownList: [
                "animal rescue and care",
                "blood donation",
                "community clean-ups",
                "language service",
            ],
            dropdownData: {
                one: {
                    value: "",
                    isRight: null,
                    answer: "blood donation",
                },
                two: {
                    value: "",
                    isRight: null,
                    answer: "language service",
                },
                three: {
                    value: "",
                    isRight: null,
                    answer: "community clean-ups",
                },
                four: {
                    value: "",
                    isRight: null,
                    answer: "animal rescue and care",
                },
            },
        };
    },
    mounted() {
        const testData = localStorage.getItem("english-testOne");
        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);
        }
        this.getPath();
    },
    methods: {
        saveWord(event, word) {
            this.$emit("saveCharacters", event, word);
        },
        setTestData() {
            localStorage.setItem("english-testOne", JSON.stringify(this.testData));
        },
        changeTestData() {
            localStorage.removeItem("english-testOne");
            this.testData = {
                check: [],
                tx: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                in: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                line: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                ts: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                },
                gr: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
                cm: {
                    one: "",
                    two: "",
                    three: "",
                    four: "",
                    five: "",
                },
            };
        },
        setBookQuestion() {
            console.log("保存");
            localStorage.setItem(
                "english-book-question-one",
                JSON.stringify(this.questionData)
            );
        },
        async getPath() {
            this.resource.listenOne = await getResourcePath(
                "422139A2EF66EA888C5ED1D550AE23E0"
            );
            this.resource.readingOne = await getResourcePath(
                "3F442B682D84C8AB06C800B29D734920"
            );
            this.resource.readingTwo = await getResourcePath(
                "E8719EC88026BCFB11D292AA999F6D3D"
            );
        },
        showAnswer(type) {
            if (type == "showImg") {
                this.showImg = !this.showImg;
            }
        },
        handleQuestion(type) {
            if (type == "one") {
                this.questionData.warnUp.one.value
                    ? (this.questionData.warnUp.one.isRight =
                        this.questionData.warnUp.one.value == "Chinese knot")
                    : (this.questionData.warnUp.one.isRight = null);
            } else if (type == "two") {
                this.questionData.warnUp.two.value
                    ? (this.questionData.warnUp.two.isRight =
                        this.questionData.warnUp.two.value == "Chinese medicine")
                    : (this.questionData.warnUp.two.isRight = null);
            } else if (type == "three") {
                this.questionData.warnUp.three.value
                    ? (this.questionData.warnUp.three.isRight =
                        this.questionData.warnUp.three.value == "Chinese calligraphy")
                    : (this.questionData.warnUp.three.isRight = null);
            } else if (type == "four") {
                this.questionData.warnUp.four.value
                    ? (this.questionData.warnUp.four.isRight =
                        this.questionData.warnUp.four.value == "Taichi")
                    : (this.questionData.warnUp.four.isRight = null);
            } else if (type == "five") {
                this.questionData.warnUp.five.value
                    ? (this.questionData.warnUp.five.isRight =
                        this.questionData.warnUp.five.value == "sweet dumpling")
                    : (this.questionData.warnUp.five.isRight = null);
            } else if (type == "six") {
                this.questionData.warnUp.six.value
                    ? (this.questionData.warnUp.six.isRight =
                        this.questionData.warnUp.six.value == "Chinese chess")
                    : (this.questionData.warnUp.six.isRight = null);
            }
        },
        handleDropdown(type) {
            const dropdownDatas = this.dropdownData;
            for (let key in dropdownDatas) {
                const item = dropdownDatas[key];
                if (type == "judge") {
                    item.value == item.answer
                        ? (item.isRight = true)
                        : (item.isRight = false);
                    console.log(item.value, item.answer);
                }
            }
            this.dropdownData = dropdownDatas;
        },
        changeDropdown() {
            localStorage.removeItem("english-dropdown-one");
            for (let key in this.dropdownData) {
                const item = this.dropdownData[key];
                item.value = "";
                item.isRight = null;
            }
        },
        setDropdownData() {
            localStorage.setItem(
                "english-dropdown-one",
                JSON.stringify(this.dropdownData)
            );
        },
        saveData() {
            console.log(this.testData);
        },
        audioPlay() {
            this.$emit("closeMiniAudio");
        },
    },
};
</script>
<style lang="less" scoped>
p {
    font-size: 16px !important;
}
.bodystyle {
    margin: 0 !important;
}
.line-border-box {
    margin-left: 10px;
    display: inline-block;
    width: 50%;
    height: 3px;
    background-color: #f9a71b;
}
.mr-20 {
    margin-right: 20px;
}
.dl-box {
    display: flex;
    flex-wrap: wrap;
    .dl-span {
        display: inline-block;
        text-indent: 0;
        margin-bottom: 15px;
        height: 20px;
        line-height: 20px;
    }
}
.btn-w {
    font-size: 14px;
    border-width: 1px;
    min-width: 80px;
    height: 30px;
    background-color: #fff;
    &:hover {
        background-color: #0bab87;
        color: #fff;
    }
}
.banshi {
    position: relative;
    margin-top: 40px;
    width: 100%;
    height: 350px;
    margin: 0 auto;
}
.pageBox {
    z-index: 9999999999;
    color: #999;
    position: absolute;
    left: 48%;
    bottom: 0px;
}
select {
    height: 24px;
}
.mini-audio {
    width: 200px;
    height: 200px;
    position: fixed;
    right: 0;
    background-color: red;
}
</style>
src/books/English/view/components/index.vue
@@ -1,36 +1,28 @@
<template>
  <div class="page-main" @scroll="throttledScrollHandler">
    <div
      class="page-content"
      :style="{
        fontSize: fontSize ? fontSize + 'px' : '16px',
        transform: `scale(${pageZoom ? pageZoom : 1})`,
        transformOrigin: 'center top',
      }"
    >
      <pageHeader
        v-if="showCatalogList.indexOf(1) > -1"
        :showPageList="loadPageList"
      ></pageHeader>
      <chapterOne
        @saveCharacters="saveCharacters"
        @closeMiniAudio="closeMiniAudio"
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
      ></chapterOne>
    <div class="page-content" :style="{
      fontSize: fontSize ? fontSize + 'px' : '16px',
      transform: `scale(${pageZoom ? pageZoom : 1})`,
      transformOrigin: 'center top',
    }">
      <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader>
      <chapterOne @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
        v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList"></chapterOne>
      <chapterTwo @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
        v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList"></chapterTwo>
        <chapterThree @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
        v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList"></chapterThree>
    </div>
    <miniAudio
      :path="audioPath"
      :currentTime="currentTime"
      @closeMiniAudio="closeMiniAudio"
      ref="audioPlayer"
    ></miniAudio>
    <miniAudio :path="audioPath" :currentTime="currentTime" @closeMiniAudio="closeMiniAudio" ref="audioPlayer">
    </miniAudio>
  </div>
</template>
<script>
import pageHeader from "./header.vue";
import chapterOne from "./chapter001.vue";
import chapterTwo from "./chapter002.vue"
import chapterThree from "./chapter003.vue"
import miniAudio from "@/components/miniAudio/index.vue";
import NoteIcon from "@/assets/images/biji.png";
import _ from "lodash";
@@ -41,7 +33,7 @@
export default {
  data() {
    return {
      catalogLength: 2, // 总章节数
      catalogLength: 4, // 总章节数
      showCatalogList: [], // 显示的章节
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
@@ -160,36 +152,36 @@
    }, 500);
    // 测试页面跳转
    // setTimeout(() => {
    //   this.gotoPage(1, 10);
    //   setTimeout(() => {
    //     this.renderSign("Highlight", {
    //       id: "2ACA9359",
    //       txt: "题一学习主题一 运动",
    //       page: "10",
    //       type: "Highlight",
    //       color: "#F5E12A"
    //     });
    // setTimeout(() => {
    //   this.delSign({
    //     ids: ["2ACA9359"]
    //   });
    // }, 2000);
    //   }, 5000);
    setTimeout(() => {
      this.gotoPage(4,56);
      //   setTimeout(() => {
      //     this.renderSign("Highlight", {
      //       id: "2ACA9359",
      //       txt: "题一学习主题一 运动",
      //       page: "10",
      //       type: "Highlight",
      //       color: "#F5E12A"
      //     });
      // setTimeout(() => {
      //   this.delSign({
      //     ids: ["2ACA9359"]
      //   });
      // }, 2000);
      //   }, 5000);
    // const pageDom = (this.container ? this.container : document)
    //   .querySelector("#app")
    //   .querySelectorAll(".page-box");
    // 检索
    // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage");
    // 检索跳转
    // this.searchItemLocation({
    //   catalog: 2,
    //   page: 10,
    //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼(见图1-1)。骨骼是人体的支架,具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下,肌肉收缩牵动所附着的骨绕着关节转动,使身体产生各种动作。所以,运动系统具有运动、支持和保护等功能,幼年时期的骨骼还具有造血功能。 ",
    //   txtIndex: 57
    // });
    // }, 5000);
      // const pageDom = (this.container ? this.container : document)
      //   .querySelector("#app")
      //   .querySelectorAll(".page-box");
      // 检索
      // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage");
      // 检索跳转
      // this.searchItemLocation({
      //   catalog: 2,
      //   page: 10,
      //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼(见图1-1)。骨骼是人体的支架,具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下,肌肉收缩牵动所附着的骨绕着关节转动,使身体产生各种动作。所以,运动系统具有运动、支持和保护等功能,幼年时期的骨骼还具有造血功能。 ",
      //   txtIndex: 57
      // });
    }, 50);
  },
  methods: {
    // setZoom1() {
@@ -448,8 +440,8 @@
          page && pageThemeColor && pageThemeColor[page]
            ? pageThemeColor[page]
            : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
            ? chapterThemeColor[chapterNum]
            : bookThemeColor;
              ? chapterThemeColor[chapterNum]
              : bookThemeColor;
        if (themeColor) {
          domItem.style.color = themeColor;
        }
@@ -466,8 +458,8 @@
          page && pageThemeColor && pageThemeColor[page]
            ? pageThemeColor[page]
            : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
            ? chapterThemeColor[chapterNum]
            : bookThemeColor;
              ? chapterThemeColor[chapterNum]
              : bookThemeColor;
        if (themeColor) {
          domItem.style.backgroundColor = themeColor;
        }
@@ -484,8 +476,8 @@
          page && pageThemeColor && pageThemeColor[page]
            ? pageThemeColor[page]
            : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
            ? chapterThemeColor[chapterNum]
            : bookThemeColor;
              ? chapterThemeColor[chapterNum]
              : bookThemeColor;
        if (themeColor) {
          domItem.style.borderColor = themeColor;
        }
@@ -720,6 +712,8 @@
      const pageData = {
        pageHeader,
        chapterOne,
        chapterTwo,
        chapterThree,
      };
      // 遍历所有章节文件
      for (const key in pageData) {
@@ -819,7 +813,7 @@
      // 记录高亮信息
      this.highlightData = data;
      // 跳转
      this.gotoPage(data.catalog, data.page, () => {});
      this.gotoPage(data.catalog, data.page, () => { });
    },
    // 点击事件:将生僻单词传给 主应用 从而调用词典功能
    saveCharacters(event, word) {
@@ -834,7 +828,7 @@
      }
      // chooseWords
    },
    // 页面向下滚动,音频小窗播放功能
    getAduio() {
      let allVideo = (
@@ -888,6 +882,8 @@
  components: {
    pageHeader,
    chapterOne,
    chapterTwo,
    chapterThree,
    miniAudio,
  },
};
@@ -898,6 +894,7 @@
  width: 100%;
  height: 100%;
  overflow: auto;
  .page-content {
    max-width: 816px;
    min-width: 375px;