闫增涛
2024-05-31 96d0790556f3a9c9d82fe7637202daa716b43e69
src/books/English/view/components/chapter001.vue
@@ -1,7 +1,8 @@
<template>
  <div class="chapter" num="0">
    <div class="page-box" page="6">
      <div class="bodystyle">
  <div class="chapter" num="2">
    <!-- 1 -->
    <div class="page-box" page="7">
      <div class="bodystyle" v-if="showPageList.indexOf(7) > -1">
        <h1 id="a005">
          <img class="img-0" alt="" src="../../assets/images/dy1.jpg" />
        </h1>
@@ -21,438 +22,2664 @@
        <p class="img"></p>
      </div>
    </div>
    <div class="page-box" page="7">
      <div class="w100 mb-20" style="padding-right: 20px">
        <div
          class="w100 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>
    <!-- 2 -->
    <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="preface-header-box event-header-text-bc">
              <span class="l-text">新标准通用职场英语</span>
              <span class="g-text event-text-color">基础模块一</span>
            </div>
          </div>
        </div>
      </div>
      <div class="padding-93">
        <div class="bodystyle">
          <h2 id="b001">
            <img class="img-0" alt="" src="../../assets/images/dy1-le1.jpg" />
          </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
        <div class="padding-93">
          <div class="bodystyle">
            <h2 id="b001">
              <img class="img-0" alt="" src="../../assets/images/dy1-le1.jpg" />
            </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
              >
              <span class="btn-box" @click="showAnswerTwo = !showAnswerTwo">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="20.501"
                  height="20.501"
                  viewBox="0 0 20.501 20.501"
                >
                  <path
                    class="a"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                </svg>
              </span>
            </p>
            <div class="openImgBox">
              <div class="fl ju-bt">
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <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"
                      />
                      <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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <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%"
                      />
                    </p>
                    <p class="center">
                      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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                    答案:Chinese medicine
                  </p>
                </div>
              </div>
              <div class="fl ju-bt">
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <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"
                      />
                      <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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <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%"
                      />
                    </p>
                    <p class="center">
                      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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                    答案:Taichi
                  </p>
                </div>
              </div>
              <div class="fl ju-bt">
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <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"
                      />
                      <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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <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%"
                      />
                    </p>
                    <p class="center">
                      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"
                        >
                          <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="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>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerTwo"
                  >
                    答案:Chinese chess
                  </p>
                </div>
              </div>
            </div>
            <p class="t0">
              <b>Ⅱ.What other symbols can you think of?</b>
              <!-- <button
                class="parimary-btn"
                @click="showAnswerOne = !showAnswerOne"
              >
                显示答案
              </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"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                </svg>
              </span>
            </p>
            <p class="t0">
              <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>
          <div class="fl ju-bt">
            <div class="left" style="width:48%">
              <p class="center">
                <el-image
                :src="imgOne"
                :preview-src-list="[imgOne]"
                class="w100"
              />
              </p>
              <p class="center">1._____________________</p>
            </div>
            <div class="right" style="width:48%">
              <p class="center">
                <el-image
                :src="imgTwo"
                :preview-src-list="[imgTwo]"
                class="w100"
              />
              </p>
              <p class="center">2._____________________</p>
            </div>
              答案: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
              archway 12. Chopsticks 13. Compass 14. Chinese kite 15. Kungfu 16.
              Opera facial makeup
            </p>
          </div>
          <div class="fl ju-bt">
            <div class="left" style="width:48%">
              <p class="center">
                <el-image
                :src="imgThree"
                :preview-src-list="[imgThree]"
                class="w100"
              />
              </p>
              <p class="center">3._____________________</p>
            </div>
            <div class="right" style="width:48%">
              <p class="center">
                <el-image
                :src="imgFour"
                :preview-src-list="[imgFour]"
                class="w100"
              />
              </p>
              <p class="center">4._____________________</p>
            </div>
          </div>
          <div class="fl ju-bt">
            <div class="left" style="width:48%">
              <p class="center">
                <el-image
                :src="imgFive"
                :preview-src-list="[imgFive]"
                class="w100"
              />
              </p>
              <p class="center">5._____________________</p>
            </div>
            <div class="right" style="width:48%">
              <p class="center">
                <el-image
                :src="imgSix"
                :preview-src-list="[imgSix]"
                class="w100"
              />
              </p>
              <p class="center">6._____________________</p>
            </div>
          </div>
          <p><b>Ⅱ.What other symbols can you think of?</b></p>
          <p>_________________________________________</p>
        </div>
      </div>
      <div class="preface-bottom">
        <span class="contet-num-box">2</span>
        <div class="preface-bottom">
          <span class="contet-num-box">2</span>
        </div>
      </div>
    </div>
    <div class="bodystyle">
      <h3 id="c002"><span class="bjh3">Listening</span></h3>
      <p>
        <b
          >Four foreigners are talking about their impressions on Chinese
          culture.Listen to the recording and match the items with the
          corresponding descriptions.</b
        >
      </p>
      <p class="center">
        <img class="img-g" alt="" src="../../assets/images/0013-1.jpg" />
      </p>
      <p class="center">
        <img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
      </p>
      <h3 id="c003"><span class="bjh3">Reading</span></h3>
      <p class="center">
        <img class="img-g" alt="" src="../../assets/images/0013-2.jpg" />
      </p>
      <p>1.How was Chinese culture introduced to the world in ancient times?</p>
      <p>
        2.China offers so much to see and explore.What took you by surprise
        about China?
      </p>
      <p class="center"><b>My Experience in Wonderland</b></p>
      <p class="block">
        “So how was your journey to China?” asks Alexandra.“Highly enjoyable,”
        responds Alice.“You should visit it sometime.”
      </p>
      <p class="right">
        —<i>Alice in Wonderland </i>(“Through the Looking Glass”)
      </p>
      <p>
        My incredible 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 cuisine and of course the huge variety of
        landscapes.
      </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 hospitable towards
        foreigners.These Chinese friends made my understanding of Chinese
        culture and civilization much easier,enjoyable and memorable.I consider
        China my second home and love it like my own country!
      </p>
      <p>
        You cannot explore China properly if you do not try its delicious
        variety of food.If you ate a new kind of food every day for one whole
        year,the list of Chinese food would still never end! Though I love to
        eat almost all kinds of Chinese cuisine,I found Sichuan and Hunan
        cuisine quite mouth-watering and stimulating.For a foodie like me,China
        is a heaven.I simply cannot live without Chinese food.
      </p>
      <p>
        Like I said earlier,China is a huge wonderland.It has thousands of years
        of rich and beautiful culture.Every city you visit tells you 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 unique atmosphere 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.
      </p>
      <p>
        There is so much to explore and I am looking forward to it during my
        stay.This is a whole new exciting experience for me,and it will always
        be remembered.
      </p>
      <p class="center">
        <img class="img-g" alt="" src="../../assets/images/0014-1.jpg" />
      </p>
      <p><span class="zt-cs">Words &amp; Expressions</span></p>
      <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>
    <!-- 3 -->
    <div class="page-box" page="9">
      <div v-if="showPageList.indexOf(9) > -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-102">
          <div class="bodystyle">
            <h3 id="c002" class="fl al-cn">
              <span class="bjh3">Listening</span>
              <audio :src="resource.listenOne" controls></audio>
            </h3>
            <p>
              <b
                >Four foreigners are talking about their impressions on Chinese
                culture.Listen to the recording and match the items with the
                corresponding descriptions.</b
              >
            </p>
            <p class="center">
              <img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
            </p>
            <h3 id="c003" class="fl al-cn">
              <span class="bjh3">Reading</span>
              <audio :src="resource.readingOne" controls></audio>
            </h3>
            <p>
              1.How was Chinese culture introduced to the world in ancient
              times?
              <!-- <button
                class="parimary-btn"
                @click="showAnswerThree = !showAnswerThree"
              >
                显示答案
              </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"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                </svg>
              </span>
            </p>
            <textarea
              v-model="questionData.reading.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>
              2.China offers so much to see and explore.What took you by
              surprise about China?
              <!-- <button
                class="parimary-btn"
                @click="showAnswerFour = !showAnswerFour"
              >
                显示答案
              </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"
                    d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z"
                    transform="translate(-3327.144 15329)"
                  />
                </svg>
              </span>
            </p>
            <textarea
              v-model="questionData.reading.two"
              placeholder="请输入内容"
              rows="6"
              style="margin-left: 40px; width: 92%"
              class="fz-16 fm-son"
              @change="setBookQuestion"
            ></textarea>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 91%"
              v-if="showAnswerFour"
            >
              答案:(1)Various delicious food (2)Unique architectures
              (3)Beautiful (4)Intangible cultural heritage, such as Taichi,
              shadow puppet show, traditional Chinese medicine, Peking Opera
              scenery
            </p>
            <p class="center"><b>My Experience in Wonderland</b></p>
            <p class="block">
              “So how was your journey to China?” asks Alexandra.“Highly
              enjoyable,” responds Alice.“You should visit it sometime.”
            </p>
            <p class="right">
              —<i>Alice in Wonderland </i>(“Through the Looking Glass”)
            </p>
            <p>
              My
              <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
              >
              and of course the huge variety of
              <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
              >
              towards foreigners.These Chinese friends made my understanding of
              Chinese culture and
              <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
              >
              China properly if you do not try its delicious variety of food.If
              you ate
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">3</span>
        </div>
      </div>
      <p>incredible /ɪnˈkredəbl/ <i>adj.</i> 难以置信的</p>
      <div class="bkbj">
        <p><i>impossible or very difficult to believe</i></p>
      </div>
      <p>cuisine /kwɪˈziːn/ <i>n.</i> (通常指昂贵的餐馆中的) 饭菜,菜肴</p>
      <div class="bkbj">
        <p><i>the food served in a restaurant (usually an expensive one)</i></p>
      </div>
      <p>landscape /ˈlændskeɪp/ <i>n.</i> (陆上) 风景,景色</p>
      <div class="bkbj">
        <p><i>scenery of an area of land</i></p>
      </div>
      <p>hospitable /hɒˈspɪtəbl/ <i>adj.</i> 好客的</p>
      <div class="bkbj">
        <p><i>pleased to welcome and entertain guests</i></p>
      </div>
      <p>
        civilization /ˌsɪvəlaɪˈzeɪʃn/ <i>n.</i> (特定时期或地区的) 社会文明
      </p>
      <div class="bkbj">
        <p>
          <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
    </div>
    <!-- 4 -->
    <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"
          >
        </p>
            <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="t0">
              a new kind of food every day for one whole year,the list of
              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
              >
              and
              <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>
            <p>
              Like I said earlier,China is a huge wonderland.It has thousands of
              years of rich and beautiful culture.Every city you visit tells you
              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
              >
              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.
            </p>
            <p>
              There is so much to explore and I am looking forward to it during
              my stay.This is a whole new exciting experience for me,and it will
              always be remembered.
            </p>
            <!-- <p class="center">
              <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="line-border-box"></span>
            </p>
            <audio
              :src="resource.readingTwo"
              controls
              style="margin-left: 10px"
            ></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>
            </div>
            <p>incredible /ɪnˈkredəbl/ <i>adj.</i> 难以置信的</p>
            <div class="bkbj">
              <p><i>impossible or very difficult to believe</i></p>
            </div>
            <p>
              cuisine /kwɪˈziːn/ <i>n.</i> (通常指昂贵的餐馆中的) 饭菜,菜肴
            </p>
            <div class="bkbj">
              <p>
                <i
                  >the food served in a restaurant (usually an expensive one)</i
                >
              </p>
            </div>
            <p>landscape /ˈlændskeɪp/ <i>n.</i> (陆上) 风景,景色</p>
            <div class="bkbj">
              <p><i>scenery of an area of land</i></p>
            </div>
            <p>hospitable /hɒˈspɪtəbl/ <i>adj.</i> 好客的</p>
            <div class="bkbj">
              <p><i>pleased to welcome and entertain guests</i></p>
            </div>
            <p>
              civilization /ˌsɪvəlaɪˈzeɪʃn/ <i>n.</i> (特定时期或地区的)
              社会文明
            </p>
            <div class="bkbj">
              <p>
                <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
                >
              </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
                >
              </p>
            </div>
            <p>mouth-watering <i>adj.</i> 令人垂涎的;美味的</p>
            <div class="bkbj">
              <p><i>that makes one want to eat; extremely delicious</i></p>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">4</span>
        </div>
      </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
    </div>
    <!-- 5 -->
    <div class="page-box" page="11">
      <div v-if="showPageList.indexOf(11) > -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>
              stimulating /ˈstɪmjuleɪtɪŋ/ <i>adj.</i> 增加活力的;增进健康的
            </p>
            <div class="bkbj">
              <p>
                <i>making you feel more active and healthy</i> foodie /ˈfuːdi/
                <i>n.</i> 吃货;美食家
              </p>
            </div>
            <p>
              <i
                >a person who is very interested in cooking and eating different
                kinds of food</i
              >
              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
                >
              </p>
            </div>
            <ul class="w100 fl fw-wr">
              <li>
                <p>get selected as ...被选为……</p>
                <p>(a) variety of ...各种各样的……</p>
                <p>come across 偶遇;碰到</p>
              </li>
              <li>
                <p>be curious about ...对……感到好奇</p>
                <p>along the way 沿途</p>
              </li>
            </ul>
            <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世纪英国作家刘易斯·卡罗尔创作的著名儿童文学作品,讲述了一个名叫爱丽丝的英国小女孩为了追逐一只揣着怀表、会说话的兔子而不慎掉入了兔子洞,从而进入了一个神奇的国度并经历了一系列奇幻冒险的故事。
              </p>
            </div>
            <p><b>Ⅰ.Reading comprehension.</b></p>
            <p>
              A.Mark the items that made the author curious when she arrived in
              China.
            </p>
            <p>
              <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"
              />
              People
            </p>
            <p>
              <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"
              />
              Cuisine
            </p>
            <p>
              <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"
              />
              Landscapes
            </p>
            <p>
              <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"
            >
              答案:Culture,Cuisine,Landscapes
            </p>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">5</span>
        </div>
      </div>
    </div>
    <!-- 6 -->
    <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"
          >
        </p>
            <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.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"
            >
              答案: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"
            >
              答案: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"
            >
              答案: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"
            >
              答案: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"
            >
              答案:Each city has its unique atmosphere with charming features
              and unique landscapes.
            </p>
            Each city has its unique atmosphere with charming features and
            unique landscapes.
            <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>
              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
              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.
            </p>
            <p
              class="event-header-text-bc pd-5"
              style="margin-left: 40px; width: 93%"
              v-if="showQuestionAnswer"
            >
              答案:cuisine, landscapes, civilization, explore, unique
            </p>
            <p>
              B.Underline the following expressions in the passage and make
              sentences with them.
            </p>
            <p>
              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"
            >
              答案: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%"
              />
            </p>
            <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%"
              />
            </p>
            <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%"
              />
            </p>
            <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%"
              />
            </p>
            <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>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">6</span>
        </div>
      </div>
      <p>mouth-watering <i>adj.</i> 令人垂涎的;美味的</p>
      <div class="bkbj">
        <p><i>that makes one want to eat; extremely delicious</i></p>
    </div>
    <!-- 7 -->
    <div class="page-box" page="13">
      <div v-if="showPageList.indexOf(13) > -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>C.Translate the following sentences into Chinese.</p>
            <p>
              1.Confucius created an atmosphere of education for the ordinary
              people.
            </p>
            <p>
              <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>
            <p>
              2.Lei Zu invented the technology of reeling silk(缫丝术)and
              greatly promoted the development of ancient Chinese civilization.
            </p>
            <p>
              <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>
            <p>
              3.Lu Yu,the author of <i>The Classic of Tea</i>,explored Chinese
              tea culture in depth.
            </p>
            <p>
              <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>
            <p>
              4.Zhang Zhongjing was a doctor who had an incredible influence on
              Chinese medical science.
            </p>
            <p>
              <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>
            <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"
                >
                  <path
                    d="M387.2 471.152l-154.768 258.72v103.488h515.792V626.384l-149.12 103.488z m283.712-51.744a77.632 77.632 0 1 0 77.392 77.616 77.504 77.504 0 0 0-77.472-77.616zM640 0H160.72A96.736 96.736 0 0 0 64 96.72V927.36a96.736 96.736 0 0 0 96.72 96.64h702.56A96.704 96.704 0 0 0 960 927.36V298.016z m7.808 94.736l226.544 211.008h-146.544a80.08 80.08 0 0 1-80-80zM896 927.36a32.688 32.688 0 0 1-32.72 32.64h-702.56A32.704 32.704 0 0 1 128 927.36V96.72A32.752 32.752 0 0 1 160.72 64l423.088 0.384v161.44a144.176 144.176 0 0 0 144 143.92H896z"
                    p-id="30865"
                  ></path>
                </svg>
              </span>
            </p>
            <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"
              />.
            </p>
            <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>
            <p>
              2.Go to my Chinese New Year party.You will meet my Chinese friends
              there.
            </p>
            <p>
              <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"
            >
              答案: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"
              />.
            </p>
            <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>
              4.One day I will go to Xi’an,and I will visit the terracotta
              warriors.
            </p>
            <p>
              <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"
            >
              答案:If I go to Xi’an one day, I will visit the terracotta
              warriors.
            </p>
            <p>
              5.Ask foreigners about their favorite Chinese food.Kung Pao
              Chicken would possibly be in top three.
            </p>
            <p>
              <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"
            >
              答案: If you ask foreigners about their favorite Chinese food,
              Kung Pao Chicken would possible be in top three
            </p>
            <p>
              B.Complete the following sentences using <i>if</i> or
              <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.
            </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.
            </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.
            </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.
            </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
              Panda Breeding.
            </p>
            <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>
            <div class="w100 fl ju-cn">
              <ul class="fl ju-ev" style="width: 80%">
                <li>
                  <button class="btn-border btn-w" @click="saveData">
                    提交
                  </button>
                </li>
                <li>
                  <button @click="setTestData" class="btn-border btn-w">
                    保存
                  </button>
                </li>
                <li>
                  <button @click="changeTestData" class="btn-border btn-w">
                    重做
                  </button>
                </li>
                <li>
                  <button
                    @click="showQuestionAnswer = !showQuestionAnswer"
                    class="parimary-btn"
                  >
                    查看答案
                  </button>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">7</span>
        </div>
      </div>
      <p>stimulating /ˈstɪmjuleɪtɪŋ/ <i>adj.</i> 增加活力的;增进健康的</p>
      <div class="bkbj">
        <p>
          <i>making you feel more active and healthy</i> foodie /ˈfuːdi/
          <i>n.</i> 吃货;美食家
        </p>
      </div>
      <p>
        <i
          >a person who is very interested in cooking and eating different kinds
          of food</i
        >
        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
    </div>
    <!-- 8 -->
    <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"
          >
        </p>
            <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="c004"><span class="bjh3">Mini-project</span></h3>
            <p>
              China is a great country with a fascinating culture.Its ancient
              civilization,rich history,and unique customs make it one of the
              most interesting countries in the world.There are so many
              interesting facts about Chinese culture.Work in groups and
              interview your group members about their knowledge of Chinese
              culture,and then:
            </p>
            <p>1.Find out interesting facts they know about Chinese culture;</p>
            <p>2.Finish the worksheet and report to the class.</p>
            <div class="fieldset">
              <p>Questions:1.Who are you going to interview?</p>
              <p>
                    2.What is he/she interested in about Chinese culture?
              </p>
              <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"
              />
            </p>
            <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>
                <td class="tl-cn">Interesting Facts He/She Knows About lt</td>
              </tr>
              <tr class="table-tr-bc">
                <td class="tl-cn">Wang Ning</td>
                <td class="wh-no tl-cn">Chinese Tea</td>
                <td>
                  China, known as the hometown of tea, is the world's
                  earliestcountry to plant tea, make tea, and drink tea. Chinese
                  peoplehave developed different varieties of tea with unique
                  flavors,such as green tea, black tea, white tea, and dark tea.
                  Drinkingtea is benefcial to our health.
                </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>
            </table>
            <p class="left">
              <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
                >
              </p>
            </div>
            <div class="resource-primary-border" style="padding: 8px">
              <div class="banshi openImgBox">
                <div class="swiper-container swiper_ppt">
                  <div class="swiper-wrapper">
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_01.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_01.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_03.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_04.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_05.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_06.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_07.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_08.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_09.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_10.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_11.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_12.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_13.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_14.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_15.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_16.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_17.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_18.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_19.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_20.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_21.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_22.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_23.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_24.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_25.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_26.png" />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img src="../../assets/images/ppt/ppt_27.png" />
                      </div>
                    </div>
                  </div>
                  <div class="swiper-button-next"></div>
                  <div class="swiper-button-prev"></div>
                  <div class="pageBox"></div>
                </div>
                <!-- 显示当前页和总页数的元素 -->
              </div>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">8</span>
        </div>
      </div>
      <p>get selected as ...被选为……</p>
      <p>(a) variety of ...各种各样的……</p>
      <p>come across 偶遇;碰到</p>
      <p>be curious about ...对……感到好奇</p>
      <p>along the way 沿途</p>
      <div class="bj-note">
        <p><b>Notes:</b></p>
        <p>
          <i>Alice in Wonderland</i> (<i>Alice's Adventures in Wonderland</i
          >的简写,中文译为《爱丽丝梦游仙境》),是19世纪英国作家刘易斯·卡罗尔创作的著名儿童文学作品,讲述了一个名叫爱丽丝的英国小女孩为了追逐一只揣着怀表、会说话的兔子而不慎掉入了兔子洞,从而进入了一个神奇的国度并经历了一系列奇幻冒险的故事。
        </p>
      </div>
      <p><b>Ⅰ.Reading comprehension.</b></p>
      <p>
        A.Mark the items that made the author curious when she arrived in China.
      </p>
      <p>□ Language</p>
      <p>□ People</p>
      <p>□ Culture</p>
      <p>□ Cuisine</p>
      <p>□ Folk art</p>
      <p>□ Landscapes</p>
      <p>□ Transportation</p>
      <p>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>
      <p>_________________________________________</p>
      <p>_________________________________________</p>
      <p>2.When and why did the author start her journey to China?</p>
      <p>_________________________________________</p>
      <p>_________________________________________</p>
      <p>3.What are the author’s expectations of her stay in China?</p>
      <p>_________________________________________</p>
      <p>_________________________________________</p>
      <p>4.What did the author think of Chinese people?</p>
      <p>_________________________________________</p>
      <p>_________________________________________</p>
      <p>5.What’s the author’s impression of the cities in China?</p>
      <p>_________________________________________</p>
      <p>_________________________________________</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>
        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_________,and of course the huge variety of
        l_________.Chinese friends helped her a lot in understanding Chinese
        culture and c_________.The author believes that one cannot
        e_________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_________atmosphere that attracts people.
      </p>
      <p>
        B.Underline the following expressions in the passage and make sentences
        with them.
      </p>
      <p>1.get selected as__________________________</p>
      <p>2.be curious about_________________________</p>
      <p>3.along the way___________________________</p>
      <p>4.come across____________________________</p>
      <p>5.look forward to__________________________</p>
      <p>C.Translate the following sentences into Chinese.</p>
      <p>
        1.Confucius created an atmosphere of education for the ordinary people.
      </p>
      <p>_________________________________________</p>
      <p>
        2.Lei Zu invented the technology of reeling silk(缫丝术)and greatly
        promoted the development of ancient Chinese civilization.
      </p>
      <p>_________________________________________</p>
      <p>
        3.Lu Yu,the author of <i>The Classic of Tea</i>,explored Chinese tea
        culture in depth.
      </p>
      <p>_________________________________________</p>
      <p>
        4.Zhang Zhongjing was a doctor who had an incredible influence on
        Chinese medical science.
      </p>
      <p>_________________________________________</p>
      <p><b>Ⅲ.Grammar focus:The conditional sentence—if-clause.</b></p>
      <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
        >_______________________________________________________________.
      </p>
      <p>
        2.Go to my Chinese New Year party.You will meet my Chinese friends
        there.
      </p>
      <p>
        <b>If</b>______________________________________________________________.
      </p>
      <p>3.Drink some Longjing tea,and you will love it.</p>
      <p>
        <b>If</b
        >_______________________________________________________________.
      </p>
      <p>
        4.One day I will go to Xi’an,and I will visit the terracotta warriors.
      </p>
      <p>
        <b>If</b>______________________________________________________________.
      </p>
      <p>
        5.Ask foreigners about their favorite Chinese food.Kung Pao Chicken
        would possibly be in top three.
      </p>
      <p>
        <b>If</b
        >_______________________________________________________________.
      </p>
      <p>
        B.Complete the following sentences using <i>if</i> or <i>whether</i>.
      </p>
      <p>1.I was wondering_______to go for a walk in the Summer Palace.</p>
      <p>
        2.We can spend the afternoon on the beach_______the weather is fine.
      </p>
      <p>
        3.I called Wang to find out_______or not he really went to see the
        Peking opera show.
      </p>
      <p>
        4.We’re not interested in________we get great jobs and that kind of
        thing.
      </p>
      <p>
        5.________I go to Sichuan,I will visit Chengdu Research Base of Giant
        Panda Breeding.
      </p>
      <h3 id="c004"><span class="bjh3">Mini-project</span></h3>
      <p>
        China is a great country with a fascinating culture.Its ancient
        civilization,rich history,and unique customs make it one of the most
        interesting countries in the world.There are so many interesting facts
        about Chinese culture.Work in groups and interview your group members
        about their knowledge of Chinese culture,and then:
      </p>
      <p>1.Find out interesting facts they know about Chinese culture;</p>
      <p>2.Finish the worksheet and report to the class.</p>
      <div class="fieldset">
        <p>Questions:1.Who are you going to interview?</p>
        <p>    2.What is he/she interested in about Chinese culture?</p>
        <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"
        />
      </p>
      <p class="center">
        <img class="img-a" alt="" src="../../assets/images/0018-1.jpg" />
      </p>
      <p class="left">
        <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
      </p>
      <div class="bk-wh">
        <p>
          exquisite ancient incredible unique traditional outstanding mouth-watering diverse hospitable enjoyable memorable charming
        </p>
    </div>
    <!-- 9 -->
    <div class="page-box" page="15">
      <div v-if="showPageList.indexOf(15) > -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">
            <h2 id="b002">
              <img class="img-0" alt="" src="../../assets/images/dy1-le2.jpg" />
            </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
              >
            </p>
            <div class="bk-wh">
              <p>
                online shopping facial recognition electronic
                payment intercity train shared bike take-away 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/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"
                        >
                          {{ 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"
                  >
                    答案: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%"
                      />
                    </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"
                  >
                    答案:online shopping
                  </p>
                </div>
              </div>
              <div class="fl ju-bt">
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <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"
                        >
                          {{ 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"
                  >
                    答案: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%"
                      />
                    </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"
                  >
                    答案:shared bike
                  </p>
                </div>
              </div>
              <div class="fl ju-bt">
                <div class="left" style="width: 48%">
                  <div>
                    <p class="center">
                      <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"
                        >
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.five.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                        </svg>
                        <svg
                          v-if="dropdownData.five.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <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%"
                      />
                    </p>
                    <p class="center">
                      6.
                      <select v-model="dropdownData.six.value">
                        <option
                          v-for="(item, index) in dropDownList"
                          :key="index"
                          :value="item"
                        >
                          {{ item }}
                        </option>
                      </select>
                      <span class="icon-box">
                        <svg
                          v-if="dropdownData.six.isRight"
                          t="1716986419862"
                          class="icon"
                          viewBox="0 0 1820 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="18767"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="40"
                          height="20"
                        >
                          <path
                            d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
                            fill="#1AFA29"
                            p-id="18768"
                          ></path>
                        </svg>
                        <svg
                          v-if="dropdownData.six.isRight == false"
                          t="1716987085767"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="25745"
                          xmlns:xlink="http://www.w3.org/1999/xlink"
                          width="20"
                          height="20"
                        >
                          <path
                            d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
                            fill="#d81e06"
                            p-id="25746"
                          ></path>
                        </svg>
                      </span>
                    </p>
                  </div>
                  <p
                    class="event-header-text-bc pd-5"
                    style="width: 90%"
                    v-if="showAnswerFive"
                  >
                    答案:facial recognition
                  </p>
                </div>
              </div>
            </div>
            <div class="w100 fl ju-cn">
              <div class="fl ju-ev mt-40" style="width: 80%">
                <button @click="setDropdownData" class="btn-border btn-w">
                  保存
                </button>
                <button
                  class="btn-border btn-w"
                  @click="handleDropdown('judge')"
                >
                  提交
                </button>
                <button class="btn-border btn-w" @click="changeDropdown">
                  重做
                </button>
                <button
                  @click="showAnswerFive = !showAnswerFive"
                  class="parimary-btn"
                >
                  查看答案
                </button>
              </div>
            </div>
          </div>
        </div>
        <div class="preface-bottom">
          <span class="contet-num-box">9</span>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources";
import Swiper from "swiper/bundle";
import "swiper/swiper-bundle.css";
export default {
  name: "chapter-one",
  props: {
    showPageList: {
      type: Array,
    },
  },
  data() {
    return {
      imgOne:require("../../assets/images/0012-1.jpg"),
      imgTwo:require("../../assets/images/0012-2.jpg"),
      imgThree:require("../../assets/images/0012-3.jpg"),
      imgFour:require("../../assets/images/0012-4.jpg"),
      imgFive:require("../../assets/images/0012-5.jpg"),
      imgSix:require("../../assets/images/0012-6.jpg"),
      imgThirteen: require("../../assets/images/grammar.jpg"),
      showAnswerOne: false,
      showAnswerTwo: false,
      showAnswerThree: false,
      showAnswerFour: false,
      showAnswerFive: false,
      showImg: false,
      showQuestionAnswer: false,
      // pageNum: "1",
      // total: "27",
      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() {
      localStorage.setItem(
        "english-book-question-one",
        JSON.stringify(this.questionData)
      );
    },
    getPath() {
      this.resource.listenOne = getResourcePath(
        "422139A2EF66EA888C5ED1D550AE23E0"
      );
      this.resource.readingOne = getResourcePath(
        "3F442B682D84C8AB06C800B29D734920"
      );
      this.resource.readingTwo = 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);
        }
      }
      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);
    },
  },
};
</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;
}
</style>