YM
2024-05-29 3002c5f4593c91cbd5dd8bc684c3800eff9ab122
Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout
15个文件已修改
3个文件已添加
1317 ■■■■ 已修改文件
src/App.vue 4 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/Cover.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/grammar.jpg 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/icon/2钩.svg 7 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/images/icon/错误-copy.svg 7 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/assets/main.less 5 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/chapter001.vue 368 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/English/view/components/header.vue 16 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/childHealth/view/content/components/chapter001.vue 6 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/childHealth/view/content/index.vue 2 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/embedded/view/components/chapter001.vue 366 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/embedded/view/components/header.vue 94 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/embedded/view/components/index.vue 36 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/embedded/view/index.vue 12 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/lifeCare/index.vue 47 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/sportsAndHealth/css/default.less 7 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/sportsAndHealth/index.vue 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/sportsAndHealth/view/chapter002.vue 339 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/App.vue
@@ -63,7 +63,9 @@
    } else {
      this.activeBook = await this.config.getBookConfig(
        // childHealth
        this.config.resourceCtx + "childHealth"
        // lifeCare
        // sportsAndHealth
        this.config.resourceCtx + "sportsAndHealth"
      );
      // æµ‹è¯•试读30页
      // this.activeBook.tryPageCount = 10;
src/books/English/assets/images/Cover.jpg
src/books/English/assets/images/grammar.jpg

src/books/English/assets/images/icon/2¹³.svg
New file
@@ -0,0 +1,7 @@
<svg 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>
src/books/English/assets/images/icon/´íÎó-copy.svg
New file
@@ -0,0 +1,7 @@
<svg 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>
src/books/English/assets/main.less
@@ -586,7 +586,7 @@
    margin-top: 0.5em;
  }
  .bjh3 {
    border: 10px dotted #faeec6;
    border: 5px dotted #faeec6;
    background: #0da785;
    padding: 0.2em 0.4em 0.2em 0.4em;
    color: #ffffff;
@@ -712,6 +712,9 @@
  .mb-20 {
    margin-bottom: 20px;
  }
  .mt-40 {
    margin-top: 40px;
  }
  .wh-nr {
    white-space: nowrap;
  }
src/books/English/view/components/chapter001.vue
@@ -1,7 +1,7 @@
<template>
  <div class="chapter" num="0">
    <!-- 1 -->
    <div class="page-box" page="6">
    <div class="page-box" page="7">
      <div class="bodystyle">
        <h1 id="a005">
          <img class="img-0" alt="" src="../../assets/images/dy1.jpg" />
@@ -23,7 +23,7 @@
      </div>
    </div>
    <!-- 2 -->
    <div class="page-box" page="7">
    <div class="page-box" page="8">
      <div class="w100 mb-20" style="padding-right: 20px">
        <div
          class="event-header-bc fl al-end"
@@ -52,7 +52,6 @@
              width="20.501"
              height="20.501"
              viewBox="0 0 20.501 20.501"
            >
              <path
                class="a"
@@ -82,14 +81,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.one.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.one.isRight == false"
                    ></i>
                    <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>
@@ -118,14 +123,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.two.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.two.isRight == false"
                    ></i>
                    <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>
@@ -153,14 +164,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.three.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.three.isRight == false"
                    ></i>
                    <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>
@@ -189,14 +206,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.four.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.four.isRight == false"
                    ></i>
                    <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>
@@ -224,14 +247,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.five.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.five.isRight == false"
                    ></i>
                    <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>
@@ -260,14 +289,20 @@
                    @change="setBookQuestion"
                  />
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="questionData.warnUp.six.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="questionData.warnUp.six.isRight == false"
                    ></i>
                    <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>
@@ -294,7 +329,6 @@
              width="20.501"
              height="20.501"
              viewBox="0 0 20.501 20.501"
            >
              <path
                class="a"
@@ -329,7 +363,7 @@
      </div>
    </div>
    <!-- 3 -->
    <div class="page-box" page="8">
    <div class="page-box" page="9">
      <ul class="preface-odd-header w100 fl ju-bt">
        <li class=""></li>
        <li class="fz-18">
@@ -373,7 +407,6 @@
              width="20.501"
              height="20.501"
              viewBox="0 0 20.501 20.501"
            >
              <path
                class="a"
@@ -413,7 +446,6 @@
              width="20.501"
              height="20.501"
              viewBox="0 0 20.501 20.501"
            >
              <path
                class="a"
@@ -457,7 +489,9 @@
            student for PhD studies at one university.When I arrived in China,I
            was like Alice in Alice in Wonderland.I was curious about the
            people,the culture,the
            <span class="word-bc" @click="saveWord($event,'cuisine')">cuisine</span>
            <span class="word-bc" @click="saveWord($event, 'cuisine')"
              >cuisine</span
            >
            and of course the huge variety of
            <span class="word-bc" @click="saveWord($event,'landscapes')"
              >landscapes</span
@@ -480,7 +514,9 @@
          </p>
          <p>
            You cannot
            <span class="word-bc" @click="saveWord($event,'explore')">explore</span>
            <span class="word-bc" @click="saveWord($event, 'explore')"
              >explore</span
            >
            China properly if you do not try its delicious variety of food.If
            you ate
          </p>
@@ -491,7 +527,7 @@
      </div>
    </div>
    <!-- 4 -->
    <div class="page-box">
    <div class="page-box" page="10">
      <div class="w100 mb-20" style="padding-right: 20px">
        <div
          class="event-header-bc fl al-end"
@@ -516,8 +552,10 @@
            <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.
            <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
@@ -525,7 +563,9 @@
            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" @click="saveWord($event, 'unique')"
              >unique</span
            >
            <span
              class="word-bc"
              style="margin-left: 5px"
@@ -544,8 +584,8 @@
          <!-- <p class="center">
            <img class="img-g" alt="" src="../../assets/images/0014-1.jpg" />
          </p> -->
          <p class="fl al-cn">
            <span class="zt-cs">Words &amp; Expressions</span>
          <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
@@ -609,7 +649,7 @@
      </div>
    </div>
    <!-- 5 -->
    <div class="page-box">
    <div class="page-box" page="11">
      <ul class="preface-odd-header w100 fl ju-bt">
        <li class=""></li>
        <li class="fz-18">
@@ -653,8 +693,8 @@
          <p>be curious about ...对……感到好奇</p>
          <p>along the way æ²¿é€”</p>
          <div class="bj-note">
            <p><b>Notes:</b></p>
            <p>
            <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世纪英国作家刘易斯·卡罗尔创作的著名儿童文学作品,讲述了一个名叫爱丽丝的英国小女孩为了追逐一只揣着怀表、会说话的兔子而不慎掉入了兔子洞,从而进入了一个神奇的国度并经历了一系列奇幻冒险的故事。
@@ -665,13 +705,15 @@
            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>
            <input type="checkbox" name="ball" value="basketball" id="1" checked="checked"/>
            Language</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1" /> People</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1"/> Culture</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1" /> Cuisine</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1" /> Folk art</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1" /> Landscapes</p>
          <p><input type="checkbox" name="ball" value="basketball" id="1" /> Transportation</p>
        </div>
      </div>
      <div class="preface-bottom">
@@ -679,7 +721,7 @@
      </div>
    </div>
    <!-- 6 -->
    <div class="page-box">
    <div class="page-box" page="12">
      <div class="w100 mb-20" style="padding-right: 20px">
        <div
          class="event-header-bc fl al-end"
@@ -914,7 +956,7 @@
      </div>
    </div>
    <!-- 7 -->
    <div class="page-box">
    <div class="page-box" page="13">
      <ul class="preface-odd-header w100 fl ju-bt">
        <li class=""></li>
        <li class="fz-18">
@@ -1160,11 +1202,17 @@
            ç­”案: 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: 50%">
            <li><button class="btn-border btn-w">提交</button></li>
            <li><button @click="setTestData" class="btn-border btn-w">保存</button></li>
              <li>
                <button @click="setTestData" class="btn-border btn-w">
                  ä¿å­˜
                </button>
              </li>
            <li>
              <button
                style="min-height:24px"
                @click="showQuestionAnswer = !showQuestionAnswer"
                class="parimary-btn"
              >
@@ -1174,12 +1222,13 @@
          </ul>
        </div>
      </div>
      </div>
      <div class="preface-bottom">
        <span class="contet-num-box">7</span>
      </div>
    </div>
    <!-- 8 -->
    <div class="page-box">
    <div class="page-box" page="14">
      <div class="w100 mb-20" style="padding-right: 20px">
        <div
          class="event-header-bc fl al-end"
@@ -1317,16 +1366,22 @@
          </p>
          <div class="bk-wh">
            <p class="dl-box">
              <span class="word-bc mr-20 dl-span" @click="saveWord($event,'exquisite')"
              <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')"
              <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')"
              ><span
                class="word-bc mr-20 dl-span"
                @click="saveWord($event, 'unique')"
                >unique</span
              ><span
                class="word-bc mr-20 dl-span"
@@ -1340,7 +1395,9 @@
                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')"
              ><span
                class="word-bc mr-20 dl-span"
                @click="saveWord($event, 'diverse')"
                >diverse</span
              ><span
                class="word-bc mr-20 dl-span"
@@ -1354,7 +1411,9 @@
                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')"
              ><span
                class="word-bc mr-20 dl-span"
                @click="saveWord($event, 'charming')"
                >charming</span
              >
            </p>
@@ -1388,7 +1447,7 @@
      </div>
    </div>
    <!-- 9 -->
    <div class="page-box">
    <div class="page-box" page="15">
      <ul class="preface-odd-header w100 fl ju-bt">
        <li class=""></li>
        <li class="fz-18">
@@ -1434,14 +1493,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.one.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.one.isRight == false"
                    ></i>
                    <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>
@@ -1474,14 +1539,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.two.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.two.isRight == false"
                    ></i>
                    <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>
@@ -1513,14 +1584,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.three.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.three.isRight == false"
                    ></i>
                    <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>
@@ -1553,14 +1630,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.four.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.four.isRight == false"
                    ></i>
                    <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>
@@ -1592,14 +1675,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.five.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.five.isRight == false"
                    ></i>
                    <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>
@@ -1632,14 +1721,20 @@
                    </option>
                  </select>
                  <span class="icon-box">
                    <i
                      class="el-icon-check correct-icon"
                      v-if="dropdownData.six.isRight"
                    ></i>
                    <i
                      class="el-icon-close error-icon"
                      v-if="dropdownData.six.isRight == false"
                    ></i>
                    <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>
@@ -1652,18 +1747,22 @@
              </p>
            </div>
          </div>
          <div class="fl ju-ev" style="width: 70%">
          <div class="w100 fl ju-cn">
            <div class="fl ju-ev" style="width: 60%">
            <button @click="setDropdownData" class="btn-border btn-w">
              ä¿å­˜
            </button>
            <button class="btn-border btn-w">提交</button>
            <button @click="handleDropdown('judge')" class="btn-border btn-w">判断正确</button>
              <button class="btn-border btn-w" @click="handleDropdown('judge')">
                æäº¤
              </button>
            <button
              style="min-height:24px"
              @click="showAnswerFive = !showAnswerFive"
              class="parimary-btn"
            >
              æŸ¥çœ‹ç­”案
            </button>
            </div>
          </div>
        </div>
      </div>
@@ -2001,6 +2100,7 @@
  font-size: 14px;
  border-width:1px;
  min-width: 80px;
  min-height: 24px;
  background-color:#fff;
  &:hover {
    background-color:#0bab87 ;
src/books/English/view/components/header.vue
@@ -1,13 +1,19 @@
<template>
  <div class="chapter" num="0">
    <!-- 1 -->
    <!--  -->
    <div class="page-box" page="1">
      <p class="center">
        <img class="img-0" alt="" src="../../assets/images/Cover.jpg" />
      </p>
    </div>
    <!-- 1 -->
    <div class="page-box" page="2">
      <p class="center">
        <img class="img-0" alt="" src="../../assets/images/SMY.jpg" />
      </p>
    </div>
    <!-- 2 -->
    <div class="page-box text-center" style="padding: 136px 0" page="2">
    <div class="page-box text-center" style="padding: 136px 0" page="3">
      <div class="box">
        <hr class="line" />
        <p class="tl fz-14"><b>图书在版编目(CIP)数据</b></p>
@@ -65,7 +71,7 @@
      </div>
    </div>
    <!-- 3 -->
    <div class="page-box " page="3">
    <div class="page-box " page="4">
      <div class="pd-20 ">
        <div class="preface w100 fl al-end ju-cn">
          <h1 id="a003" class="front preface-text">前言</h1>
@@ -93,7 +99,7 @@
      </div>
    </div>
    <!-- 4 -->
    <div class="page-box" page="4">
    <div class="page-box" page="5">
      <div class="mb-20" style="padding-right: 20px;">
        <div class="primary-bc fl al-end" style="height: 100px;padding-left: 40px;">
          <div class="preface-header-box y-bc">
@@ -137,7 +143,7 @@
      </div>
    </div>
    <!-- 5 -->
    <div class="page-box" page="5">
    <div class="page-box" page="6">
      <ul class="preface-odd-header w100 fl ju-bt">
        <li class="left primary-bc "></li>
        <li>
src/books/childHealth/view/content/components/chapter001.vue
@@ -67,7 +67,7 @@
    </div>
    <!-- 2 -->
    <div class="page-box" page="10"  :show="showPageList.indexOf(10) > -1">
      <div v-if="showPageList.indexOf(10) > -1">
      <div v-show="showPageList.indexOf(10) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -360,8 +360,6 @@
              v-if="testOne && questionData"
              ref="examinationOne"
              :cardList="questionData[10]"
              :chapter="1"
              :page="2"
            />
          </div>
          <h2 class="module_block" id="b001" style="margin: 0">
@@ -434,7 +432,7 @@
    </div>
    <!-- 3 -->
    <div class="page-box" page="11" :show="showPageList.indexOf(11) > -1">
      <div v-if="showPageList.indexOf(11) > -1">
      <div v-show="showPageList.indexOf(11) > -1">
        <div class="page-header-box">
          <span class="page-header-text"
            >专题一&nbsp;学前儿童生理发展特点与保健</span
src/books/childHealth/view/content/index.vue
@@ -556,6 +556,7 @@
                      testData[catalog][page],
                      this.config.activeBook
                    );
                  } else {
                    const obj = {};
                    for (let key in testData[catalog][page]) {
@@ -567,6 +568,7 @@
                    }
                    this.questionData[page] = obj;
                  }
                  console.log('题目',this.questionData);
                }
              }
            }
src/books/embedded/view/components/chapter001.vue
@@ -1,7 +1,8 @@
<template>
  <div class="chapter" num="1">
  <div class="chapter" num="2">
    <!-- 1 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-87" page="11">
      <div v-if="showPageList.indexOf(11) > -1">
      <div class="mt-100 w100">
        <!-- <h1>项目一 触摸屏组态介绍</h1> -->
        <img src="../../assets/images/project-one.png" alt="" class="w100" />
@@ -55,8 +56,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 2 -->
    <div class="page-box fl fl-cl ju-bt" page="12">
      <div v-if="showPageList.indexOf(12) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" class="w100" />
@@ -201,6 +204,7 @@
          </div>
        </div>
      </div>
      </div>
      <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40 padding-96">
        <li class="footer-num">2</li>
        <li class="footer-box"></li>
@@ -208,6 +212,7 @@
    </div>
    <!-- 3 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-86" page="13">
      <div v-if="showPageList.indexOf(13) > -1">
      <div>
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
@@ -275,8 +280,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 4 -->
    <div class="page-box fl fl-cl ju-bt" page="14">
      <div v-if="showPageList.indexOf(14) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
@@ -352,8 +359,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 5 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96" page="15">
      <div v-if="showPageList.indexOf(15) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
@@ -371,7 +380,9 @@
            <p class="imgdescript">图1-6 正视图</p>
          </div>
          <div class="">
            <el-image :src="imgSeven" :preview-src-list="[imgSeven]" />
              <div class="openImgBox">
                <img src="../../assets/images/img00017002.jpg" alt="" class="w100">
              </div>
            <p class="imgdescript">图1-7 背视图</p>
          </div>
        </div>
@@ -385,7 +396,9 @@
            <p class="content">③使用一字头旋具将TPC电源插头螺钉锁紧。</p>
          </div>
          <div class="right">
            <el-image :src="imgEnight" :preview-src-list="[imgEnight]" />
              <div class="openImgBox">
                <img src="../../assets/images/img00017003.jpg" alt="" class="w100">
              </div>
            <p class="imgdescript">图1-8 电源插头示意图及引脚定义</p>
          </div>
        </div>
@@ -394,11 +407,15 @@
          ï¼ˆ4)TPC7062K外部接口。接口说明如图1-9所示,串口引脚定义如图1-10所示。
        </p>
        <div>
          <el-image :src="imgNine" :preview-src-list="[imgNine]" class="w100" />
            <div class="openImgBox">
                <img src="../../assets/images/img00017004.jpg" alt="" class="w100">
              </div>
          <p class="imgdescript">图1-9 接口说明</p>
        </div>
        <div>
          <el-image :src="imgTen" :preview-src-list="[imgTen]" />
            <div class="openImgBox">
                <img src="../../assets/images/img00017005.jpg" alt="" class="w100">
              </div>
          <p class="imgdescript">图1-10 串口引脚定义</p>
        </div>
        <p class="content">
@@ -410,15 +427,19 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 6 -->
    <div class="page-box fl fl-cl ju-bt" page="16">
      <div v-if="showPageList.indexOf(16) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
        </div>
        <div class="padding-96">
          <div>
            <el-image :src="imgEleven" :preview-src-list="[imgEleven]" />
              <div class="openImgBox">
                <img src="../../assets/images/img00018001.jpg" alt="" class="w100">
              </div>
            <p class="imgdescript">图1-11 TPC启动过程</p>
          </div>
          <p class="quotation fl al-cn t0 primary-color">
@@ -433,14 +454,19 @@
            TPC7062K与三款主流PLC通信接线如图1-12~图1-14所示。
          </p>
          <div style="width: 90%" class="m0-auto">
            <el-image :src="imgTwelve" :preview-src-list="[imgTwelve]" />
              <div class="openImgBox">
                <img src="../../assets/images/img00018002.jpg" alt="" class="w100">
              </div>
            <p class="imgdescript">
              å›¾1-12 TPC7062K与西门子S7-200系列PLC通信接线
            </p>
          </div>
          <div class="m0-auto" style="width: 90%">
            <el-image :src="imgThirteen" :preview-src-list="[imgThirteen]" />
              <div class="openImgBox">
                <img src="../../assets/images/img00018003.jpg" alt="" class="w100">
              </div>
            <p class="imgdescript">图1-13 TPC7062K与欧姆龙PLC通信接线</p>
            </div>
          </div>
        </div>
      </div>
@@ -451,12 +477,15 @@
    </div>
    <!-- 7 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96" page="17">
      <div v-if="showPageList.indexOf(17) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
        </div>
        <div>
          <el-image :src="imgFourteen" :preview-src-list="[imgFourteen]" />
            <div class="openImgBox">
                <img src="../../assets/images/img00019001.jpg" alt="" class="w100">
              </div>
          <p class="imgdescript">图1-14 TPC7062K与三菱FX系列PLC通信接线</p>
        </div>
        <p class="content">评分表见表1-1。</p>
@@ -663,8 +692,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 8 -->
    <div class="page-box fl fl-cl ju-bt" page="18">
      <div v-if="showPageList.indexOf(18) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
@@ -689,27 +720,79 @@
            ï¼ˆ6)安装完成后,Windows操作系统的桌面上添加了如图1-20所示的两个快捷方式图标,分别用于启动MCGS嵌入式组态环境和模拟运行环境。
          </p>
          <div class="qrbodyPic">
            <el-carousel
              trigger="click"
              class="bones-carousel carousel-image"
              arrow="always"
              indicator-position="none"
              <div class="banshi openImgBox">
                  <div class="swiper-container">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
            >
              <el-carousel-item
                v-for="(item, index) in bonesList"
                :key="index"
                class="bones-carousel-item"
              >
                <el-image
                  :src="item"
                  :preview-src-list="bonesList"
                  :preview-teleported="true"
                  class="open-image"
                          <img
                            src="../../assets/images/carousel-one.png"
                />
              </el-carousel-item>
            </el-carousel>
          </div>
        </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/carousel-two.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/carousel-three.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/carousel-four.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/carousel-five.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/carousel-six.png"
                          />
                        </div>
                      </div>
                    </div>
                    <div class="swiper-pagination"></div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                  </div>
                </div>
            </div>
          </div>
        </div>
      </div>
      <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40 padding-96">
        <li class="footer-num">8</li>
@@ -718,6 +801,7 @@
    </div>
    <!-- 9 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96 pr" page="19">
      <div v-if="showPageList.indexOf(19) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
@@ -1013,7 +1097,9 @@
          ï¼ˆ2)选择“文件”菜单中的“工程另存为”命令,弹出“文件保存”对话框,在文件名一栏内输入“常用构件使用”,单击“保存”按钮,工程创建完毕。
        </p>
        <div class="qrbodyPic">
          <img src="../../assets/images/img00021003.jpg" active="true" />
            <div class="openImgBox">
                <img src="../../assets/images/img00021003.jpg" alt="" class="w100">
              </div>
          <p class="imgdescript">图1-21 选择TPC类型</p>
        </div>
        <p class="quotation fl al-cn t0 primary-color">
@@ -1036,8 +1122,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 10 -->
    <div class="page-box fl fl-cl ju-bt" page="20">
      <div v-if="showPageList.indexOf(20) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
@@ -1045,11 +1133,15 @@
        <div class="padding-96">
          <div class="fl ju-bt w100">
            <div>
              <el-image :src="imgFifteen" :preview-src-list="[imgFifteen]" />
                <div class="openImgBox">
                <img src="../../assets/images/img00022001.jpg" alt="" class="w100">
              </div>
              <p class="imgdescript">图1-22 建立新窗口</p>
            </div>
            <div class="">
              <el-image :src="imgSixteen" :preview-src-list="[imgSixteen]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00022002.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-23 窗口属性设置</p>
            </div>
          </div>
@@ -1061,14 +1153,15 @@
          </p>
          <div class="fl ju-bt">
            <div>
              <el-image
                :src="imgSeventeen"
                :preview-src-list="[imgSeventeen]"
              />
                <div class="openImgBox">
                  <img src="../../assets/images/img00022003.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-24 按钮制作</p>
            </div>
            <div>
              <el-image :src="imgEighteen" :preview-src-list="[imgSeventeen]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00022004.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-25 标准按钮构件属性设置</p>
            </div>
          </div>
@@ -1091,38 +1184,46 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 11 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96 pr" page="21">
      <div v-if="showPageList.indexOf(21) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
        </div>
        <div class="fl ju-bt">
          <div>
            <el-image :src="imgNineTeen" :preview-src-list="[imgNineTeen]" />
              <div class="openImgBox">
                  <img src="../../assets/images/img00023001.jpg" alt="" class="w100">
                </div>
            <p class="imgdescript">图1-26 按钮文字修改</p>
          </div>
          <div>
            <el-image :src="imgTwenty" :preview-src-list="[imgTwenty]" />
              <div class="openImgBox">
                  <img src="../../assets/images/img00023002.jpg" alt="" class="w100">
                </div>
            <p class="imgdescript">图1-27 按钮排列</p>
          </div>
        </div>
        <div class="qrbodyPic">
          <el-image
            :src="imgtOne"
            :preview-src-list="[imgtOne]"
            class="source-img"
          />
            <div class="openImgBox">
                  <img src="../../assets/images/img00023003.jpg" alt="" class="w100">
                </div>
          <p class="imgdescript">图1-28 添加指示灯</p>
        </div>
        <div class="fl">
          <div>
            <el-image :src="imgtTwo" :preview-src-list="[imgtTwo]" />
              <div class="openImgBox">
                  <img src="../../assets/images/img00023004.jpg" alt="" class="w100">
                </div>
            <p class="imgdescript">图1-29 制作标签</p>
          </div>
          <div style="width: 66%">
            <el-image :src="imgtThree" :preview-src-list="[imgtThree]" />
              <div class="openImgBox">
                  <img src="../../assets/images/img00023005.jpg" alt="" class="w100">
                </div>
            <p class="imgdescript">图1-30 标签动画组态属性设置</p>
          </div>
        </div>
@@ -1139,8 +1240,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 12 -->
    <div class="page-box fl fl-cl ju-bt" page="22">
      <div v-if="showPageList.indexOf(22) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
@@ -1148,11 +1251,15 @@
        <div class="padding-96">
          <div class="fl">
            <div>
              <el-image :src="imgtFour" :preview-src-list="[imgtFour]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00024001.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-31 制作输入框</p>
            </div>
            <div>
              <el-image :src="imgtFive" :preview-src-list="[imgtFive]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00024002.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-32 输入框排列</p>
            </div>
          </div>
@@ -1162,11 +1269,15 @@
          </p>
          <div class="fl">
            <div>
              <el-image :src="imgtSix" :preview-src-list="[imgtSix]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00024003.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-33 标准按钮构件属性设置”对话框</p>
            </div>
            <div>
              <el-image :src="imgtSeven" :preview-src-list="[imgtSeven]" />
                <div class="openImgBox">
                  <img src="../../assets/images/img00024004.jpg" alt="" class="w100">
                </div>
              <p class="imgdescript">图1-34 控制按钮设置</p>
            </div>
          </div>
@@ -1191,7 +1302,9 @@
            </div>
            <div style="width: 40%">
              <div class="qrbodyPic">
                <el-image :src="imgtEnight" :preview-src-list="[imgtEnight]" />
                  <div class="openImgBox">
                    <img src="../../assets/images/img00024005.jpg" alt="" class="w100">
                  </div>
                <p class="imgdescript">图1-35 组态错误对话框</p>
              </div>
            </div>
@@ -1211,19 +1324,25 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 13 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96 pr" page="23">
      <div v-if="showPageList.indexOf(23) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
        </div>
        <div class="fl">
          <div>
            <el-image :src="imgtNine" :preview-src-list="[imgtNine]" />
              <div class="openImgBox">
                    <img src="../../assets/images/img00025001.jpg" alt="" class="w100">
                  </div>
            <p class="imgdescript">图1-36 数据对象属性设置</p>
          </div>
          <div>
            <el-image :src="imgtTen" :preview-src-list="[imgtTen]" />
              <div class="openImgBox">
                    <img src="../../assets/images/img00025002.jpg" alt="" class="w100">
                  </div>
            <p class="imgdescript">图1-37 按下功能设置</p>
          </div>
        </div>
@@ -1232,11 +1351,15 @@
        </p>
        <div class="fl">
          <div>
            <el-image :src="imgrOne" :preview-src-list="[imgrOne]" />
              <div class="openImgBox">
                    <img src="../../assets/images/img00025003.jpg" alt="" class="w100">
                  </div>
            <p class="imgdescript">图1-38 选择数据对象指示灯</p>
          </div>
          <div>
            <el-image :src="imgrTwo" :preview-src-list="[imgrTwo]" />
              <div class="openImgBox">
                    <img src="../../assets/images/img00025004.jpg" alt="" class="w100">
                  </div>
            <p class="imgdescript">图1-39 指示灯1属性操作</p>
          </div>
        </div>
@@ -1260,7 +1383,9 @@
            />按钮,进行下载配置。单击“联机运行”按钮,如图1-41所示,选择“USB通信”连接方式,然后单击“通信测试”按钮,通信测试正常后,单击“工程下载”按钮,如图1-42所示。
          </p>
          <div style="width: 30%">
            <el-image :src="imgrThree" :preview-src-list="[imgrThree]" />
              <div class="openImgBox">
                    <img src="../../assets/images/img00025006.jpg" alt="" class="w100">
                  </div>
            <p class="imgdescript">图1-40 标准USB2.0打印机线</p>
          </div>
        </div>
@@ -1282,8 +1407,10 @@
        <li class="footer-box"></li>
      </ul>
    </div>
    </div>
    <!-- 14 -->
    <div class="page-box fl fl-cl ju-bt" page="24">
      <div v-if="showPageList.indexOf(24) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
@@ -1313,7 +1440,7 @@
            é™¤äº†ä¸‹è½½åˆ°TPC进行模拟调试外,可以在计算机上进行模拟运行。选择“模拟运行”,单击“工程下载”按钮后进入运行环境。按下“指示灯1”按钮,如图1-45所示,“指示灯1”变绿,“状态显示1:”为“1”,松手后复位;按下“指示灯2”按钮,如图1-46所示,“指示灯2”变绿,“状态显示2:”为“1”。
          </p>
          <div class="qrbodyPic">
            <el-carousel
              <!-- <el-carousel
              trigger="click"
              class="img-carousel carousel-image"
              arrow="always"
@@ -1331,7 +1458,77 @@
                  class="open-image"
                />
              </el-carousel-item>
            </el-carousel>
              </el-carousel> -->
              <div class="banshi openImgBox">
                  <div class="swiper-container">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-one.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-two.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-three.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-four.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-five.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../assets/images/img-list-six.png"
                          />
                        </div>
                      </div>
                    </div>
                    <div class="swiper-pagination"></div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                  </div>
                </div>
            </div>
          </div>
        </div>
      </div>
@@ -1342,6 +1539,7 @@
    </div>
    <!-- 15 -->
    <div class="page-box fl fl-cl ju-bt al-end padding-96 pr" page="25">
      <div v-if="showPageList.indexOf(25) > -1">
      <div class="w100">
        <div class="primary-color fz-18 fw-bl mt-100 fl ju-ed mb-20">
          <img src="../../assets/images/header-one.png" alt="" />
@@ -1613,55 +1811,18 @@
      </ul>
    </div>
  </div>
  </div>
</template>
<script>
export default {
  name: "chapterOne",
  props: {
    showPageList: {
      type: Array,
    },
  },
  data() {
    return {
      imgOne: require("../../assets/images/img00014001.jpg"),
      imgTwo: require("../../assets/images/img00014002.jpg"),
      imgThree: require("../../assets/images/img00014003.jpg"),
      imgFour: require("../../assets/images/img00014004.jpg"),
      imgFive: require("../../assets/images/img00015001.jpg"),
      imgSix: require("../../assets/images/img00017001.jpg"),
      imgSeven: require("../../assets/images/img00017002.jpg"),
      imgEnight: require("../../assets/images/img00017003.jpg"),
      imgNine: require("../../assets/images/img00017004.jpg"),
      imgTen: require("../../assets/images/img00017005.jpg"),
      imgEleven: require("../../assets/images/img00018001.jpg"),
      imgTwelve: require("../../assets/images/img00018002.jpg"),
      imgThirteen: require("../../assets/images/img00018003.jpg"),
      imgFourteen: require("../../assets/images/img00019001.jpg"),
      imgFifteen: require("../../assets/images/img00022001.jpg"),
      imgSixteen: require("../../assets/images/img00022002.jpg"),
      imgSeventeen: require("../../assets/images/img00022003.jpg"),
      imgEighteen: require("../../assets/images/img00022004.jpg"),
      imgNineTeen: require("../../assets/images/img00023001.jpg"),
      imgTwenty: require("../../assets/images/img00023002.jpg"),
      imgtOne: require("../../assets/images/img00023003.jpg"),
      imgtTwo: require("../../assets/images/img00023004.jpg"),
      imgtThree: require("../../assets/images/img00023005.jpg"),
      imgtFour: require("../../assets/images/img00024001.jpg"),
      imgtFive: require("../../assets/images/img00024002.jpg"),
      imgtSix: require("../../assets/images/img00024003.jpg"),
      imgtSeven: require("../../assets/images/img00024004.jpg"),
      imgtEnight: require("../../assets/images/img00024005.jpg"),
      imgtNine: require("../../assets/images/img00025001.jpg"),
      imgtTen: require("../../assets/images/img00025002.jpg"),
      imgrOne: require("../../assets/images/img00025003.jpg"),
      imgrTwo: require("../../assets/images/img00025004.jpg"),
      imgrThree: require("../../assets/images/img00025006.jpg"),
      tableOne: require("../../assets/images/img00019002.jpg"),
      videoOne: true,
      bonesList: [
        require("../../assets/images/carousel-one.png"),
        require("../../assets/images/carousel-two.png"),
        require("../../assets/images/carousel-three.png"),
        require("../../assets/images/carousel-four.png"),
        require("../../assets/images/carousel-five.png"),
        require("../../assets/images/carousel-six.png"),
      ],
      imgList: [
        require("../../assets/images/img-list-one.png"),
        require("../../assets/images/img-list-two.png"),
@@ -1695,7 +1856,8 @@
</script>
<style scoped lang="less">
p {
  font-family: "Segoe UI", Arial, "宋体", SimSun, sans-serif !important;
  // font-family: "Segoe UI", Arial, "宋体", SimSun, sans-serif !important;
  font-family: "Times New Roman", "宋体", SimSun, sans-serif !important;
  margin: 0;
  text-align: justify;
}
@@ -1759,4 +1921,10 @@
  text-indent: 0;
  padding-left: 23px;
}
.banshi {
  margin-top: 40px;
  width: 100%;
  height: 350px;
  margin: 0 auto;
}
</style>
src/books/embedded/view/components/header.vue
@@ -1,10 +1,16 @@
<template>
  <div class="chapter" num="0">
  <div class="chapter" num="1">
    <!-- å°é¢ -->
    <div class="page-box" page="1">
      <div v-if="showPageList.indexOf(1) > -1">
      <h1 class="frontCover" title="">
        <img alt="封面" src="../../assets/images/device_pad_Frontcover.jpg" class="cover-box w100" />
          <img
            alt="封面"
            src="../../assets/images/device_pad_Frontcover.jpg"
            class="cover-box w100"
          />
      </h1>
      </div>
    </div>
    <!-- ä½œè€…简介 -->
    <div
@@ -12,6 +18,7 @@
      style="width: 408px; margin: 0 auto"
      page="2"
    >
      <div v-if="showPageList.indexOf(2) > -1">
      <document>
        <h1 class="author-box">作者简介</h1>
        <div class="bodyPic">
@@ -28,14 +35,22 @@
        </p>
      </document>
    </div>
    </div>
    <!-- å°é¢ -->
    <div class="page-box" page="3">
      <div v-if="showPageList.indexOf(3) > -1">
      <h1 class="frontCover" title="封面">
        <img alt="封面" src="../../assets/images/device_pad_Frontcover.jpg" class="cover-box w100">
          <img
            alt="封面"
            src="../../assets/images/device_pad_Frontcover.jpg"
            class="cover-box w100"
          />
      </h1>
      </div>
    </div>
    <!-- å†…容简介 -->
    <div class="page-box page-padding neirong" page="4">
      <div v-if="showPageList.indexOf(4) > -1">
      <document>
        <h1>内容简介</h1>
        <p class="quotation cl-66">
@@ -59,8 +74,8 @@
      <p class="contentCR">ISBN:9787113254025</p>
      <p class="contentCR">本书由中国铁道出版社进行制作与发行。</p>
      <p class="contentCR">版权所有·侵权必究</p> -->
      <div style="width: 65%;" class="fw-box">
        <img src="../../assets/images/banquan.png">
        <div style="width: 65%" class="fw-box">
          <img src="../../assets/images/banquan.png" />
        <!-- <p class="content">图书在版编目(CIP)数据</p>
        <p class="content">嵌入式组态控制技术/张文明,华祖银主编.-3 ç‰ˆ.</p>
        <p class="content">-北京:中国铁道出版社有限公司,2019.7</p>
@@ -92,13 +107,27 @@
      </div>
      <hr />
      <p class="t0">出版发行:中国铁道出版社有限公司(100054,北京市西城区右安门西街8号)</p>
      <p class="t0">网&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址:http:// www.tdpress.com/5 leds/</p>
      <p class="t0">印&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刷:北京柏力行彩印有限公司</p>
      <p class="t0">版&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;次:2011å¹´8月第1版 2019å¹´7月第3版 2019å¹´7月第1次印刷</p>
      <p class="t0">开&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;本:787mmx1092mm1/16印张:18字数:433千</p>
        <p class="t0">
          å‡ºç‰ˆå‘行:中国铁道出版社有限公司(100054,北京市西城区右安门西街8号)
        </p>
        <p class="t0">
          ç½‘&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址:http:// www.tdpress.com/5
          leds/
        </p>
        <p class="t0">
          å°&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刷:北京柏力行彩印有限公司
        </p>
        <p class="t0">
          ç‰ˆ&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;次:2011å¹´8月第1版
          2019å¹´7月第3版 2019å¹´7月第1次印刷
        </p>
        <p class="t0">
          å¼€&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;本:787mmx1092mm1/16印张:18字数:433千
        </p>
      <p class="t0">印&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数:1~2000册</p>
      <p class="t0">书&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:SBN978-7-113-25402-5</p>
        <p class="t0">
          ä¹¦&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:SBN978-7-113-25402-5
        </p>
      <p class="t0">定&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价:59.80元</p>
      <hr />
      <p class="tl-cn">版权所有,侵权必究</p>
@@ -107,8 +136,10 @@
      </p>
      <p class="tl-cn">打击盗版举报电话:(010)51873659</p>
    </div>
    </div>
    <!-- ç¼–审委员会 -->
    <div class="page-box page-padding" page="5">
      <div v-if="showPageList.indexOf(5) > -1">
      <document>
        <p class="content t-center bs-box">
          å…¨å›½é«˜èŒé«˜ä¸“院校机电类专业规划教材
@@ -151,8 +182,10 @@
        </div>
      </document>
    </div>
    </div>
    <!-- å‡ºç‰ˆè¯´æ˜Ž -->
    <div class="page-box pd-104" page="6">
      <div v-if="showPageList.indexOf(6) > -1">
      <div class="page-heder-img">
        <img src="../../assets/images/publish.png" alt="" class="mt-100" />
      </div>
@@ -190,8 +223,10 @@
        </document>
      </div>
    </div>
    </div>
    <!-- ç¬¬ä¸‰ç‰ˆ -->
    <div class="page-box pd-104" page="7">
      <div v-if="showPageList.indexOf(7) > -1">
      <div class="page-heder-img">
        <img src="../../assets/images/qianyan.png" class="mt-100" alt="" />
      </div>
@@ -231,15 +266,18 @@
        </document>
      </div>
    </div>
    </div>
    <!-- 3-1 -->
    <div class="page-box fl fl-cl ju-bt" page="8">
      <div>
      <div v-if="showPageList.indexOf(8) > -1">
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
        </div>
        <div class="padding-96">
          <document>
            <p class="t0">到提高学生学习兴趣和效率以及易学、易懂、易上手的目的。</p>
            <p class="t0">
              åˆ°æé«˜å­¦ç”Ÿå­¦ä¹ å…´è¶£å’Œæ•ˆçŽ‡ä»¥åŠæ˜“å­¦ã€æ˜“æ‡‚ã€æ˜“ä¸Šæ‰‹çš„ç›®çš„ã€‚
            </p>
            <p class="quotation fl al-cn t0">
              <img
                src="../../assets/images/icon/neirong.png"
@@ -249,7 +287,11 @@
              <b>基本内容</b>
            </p>
            <p class="quotation">
              æœ¬ä¹¦ç”±å½©è‰²çº¸è´¨æ•™æå’Œç½‘络资源组成。彩色纸质教材由九个项目组成,每个项目中的任务安排了任务目标、任务描述和任务训练。网络资源含嵌入版组态软件、工程案例、教学案例、程序源代码、微课等,为“教”和“学”提供了生动、直观、便捷、立体的教学资源包。视频资源通过扫描二维码获取,其他相关资源可从我社网站(<a href="http://www.tdpress.com/51eds/">http://www.tdpress.com/51eds/</a> ï¼‰ä¸‹è½½ã€‚
              æœ¬ä¹¦ç”±å½©è‰²çº¸è´¨æ•™æå’Œç½‘络资源组成。彩色纸质教材由九个项目组成,每个项目中的任务安排了任务目标、任务描述和任务训练。网络资源含嵌入版组态软件、工程案例、教学案例、程序源代码、微课等,为“教”和“学”提供了生动、直观、便捷、立体的教学资源包。视频资源通过扫描二维码获取,其他相关资源可从我社网站(<a
                href="http://www.tdpress.com/51eds/"
                >http://www.tdpress.com/51eds/</a
              >
              ï¼‰ä¸‹è½½ã€‚
            </p>
            <p class="quotation">
              æœ¬ä¹¦ç”±å¼ æ–‡æ˜Žã€åŽç¥–银任主编,王一凡、陈东升、黄晓伟、曹建军、宋黎菁、缪建华、付华良、贾君贤任副主编,具体编写分工如下:张文明教授撰写前言;张文明教授和华祖银总工程师共同编写项目一;黄晓伟工程师编写项目二、项目三(任务一~任务四);陈东升工程师编写项目五;王一凡副教授编写项目四、项目六;宋黎菁工程师编写项目七、项目三(任务六);付华良副教授编写项目三(任务五)、曹建军副教授和贾君贤讲师共同编写项目八;缪建华高级技师编写项目九。全书由张文明教授指导并负责统稿,汤晓华教授和北京昆仑通态自动化软件科技有限公司刘志军高级工程师主审。
@@ -272,8 +314,13 @@
    </div>
    <!-- ç¬¬ä¸€ç‰ˆ -->
    <div class="page-box" page="9">
      <div v-if="showPageList.indexOf(9) > -1">
      <div class="page-heder-img">
        <img src="../../assets/images/qianyan-one.png" class="mt-100" alt="" />
          <img
            src="../../assets/images/qianyan-one.png"
            class="mt-100"
            alt=""
          />
      </div>
      <div class="padding-96">
        <document>
@@ -311,11 +358,17 @@
        </document>
      </div>
    </div>
    </div>
    <!-- 1-1 -->
    <div class="page-box fl fl-cl ju-bt" page="10">
      <div v-if="showPageList.indexOf(10) > -1">
      <div>
        <div class="mt-20">
          <img src="../../assets/images/page-header.png" alt="" class="w100" />
            <img
              src="../../assets/images/page-header.png"
              alt=""
              class="w100"
            />
        </div>
        <div class="padding-96">
          <document>
@@ -351,21 +404,22 @@
      </ul>
    </div>
  </div>
  </div>
</template>
<script>
export default {
  name: "headerPage",
  props:{
    showPageList:{
      type:Array
    }
  }
      type: Array,
    },
  },
};
</script>
<style scoped lang="less">
p {
  text-align: justify;
  // color: #666;
  font-family: "Times New Roman", "宋体", SimSun, sans-serif !important;
}
.author-padding {
  padding: 104px 20px 104px 20px;
src/books/embedded/view/components/index.vue
@@ -1,12 +1,21 @@
<template>
  <div class="page-main" @scroll="throttledScrollHandler">
    <div class="page-content"       :style="{
    <div
      class="page-content"
      :style="{
        fontSize: fontSize ? fontSize + 'px' : '16px',
        transform: `scale(${pageZoom ? pageZoom : 1})`,
        transformOrigin: 'center top',
      }">
      <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader>
      <chapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" />
      }"
    >
      <pageHeader
        v-if="showCatalogList.indexOf(1) > -1"
        :showPageList="loadPageList"
      ></pageHeader>
      <chapterOne
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
      />
    </div>
  </div>
</template>
@@ -42,7 +51,7 @@
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      testData:{}
      testData: {},
    };
  },
  watch: {
@@ -62,7 +71,7 @@
          this.initObservation();
          this.initThemeColor();
        }, 500);
      }
      },
    },
    loadPageList: {
      handler(newVal, oldVal) {
@@ -70,8 +79,8 @@
          this.initSwiper();
          this.initViewer();
        }, 200);
      }
    }
      },
    },
  },
  mounted() {
    // é»˜è®¤åŠ è½½ç« èŠ‚
@@ -418,7 +427,7 @@
            this.$store.state.qiankun.pageChange({
              page: page,
              catalog: catalog,
              text
              text,
            });
          // const sections = Array.from(document.querySelectorAll(".section"));
          //sections:获取所有具有 .section ç±»åçš„元素,并转换为数组。
@@ -463,6 +472,7 @@
            //   }
            // }
            this.loadPageList.push(Number(page));
            console.log('页码列表',this.loadPageList);
            if (this.loadPageList.length > 5) {
              // è¶…过5页
              this.loadPageList.shift();
@@ -482,7 +492,7 @@
          autoplay: {
            //自动开始
            delay: 3000, //时间间隔
            disableOnInteraction: false //*手动操作轮播图后不会暂停*
            disableOnInteraction: false, //*手动操作轮播图后不会暂停*
          },
          paginationClickable: true,
          slidesPerView: 1, // ä¸€ç»„三个
@@ -490,7 +500,7 @@
          // å¦‚果需要前进后退按钮
          navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev"
            prevEl: ".swiper-button-prev",
          },
          // çª—口变化,重新init,针对F11全屏和放大缩小,必须加
          observer: true,
@@ -512,10 +522,10 @@
        new Viewer(dom, {
          navbar: true, // æ˜¾ç¤ºå¯¼èˆªæ 
          toolbar: true, // æ˜¾ç¤ºå·¥å…·æ 
          title: true // æ˜¾ç¤ºæ ‡é¢˜
          title: true, // æ˜¾ç¤ºæ ‡é¢˜
        });
      }
    }
    },
  },
};
</script>
src/books/embedded/view/index.vue
@@ -2,10 +2,6 @@
  <div
    class="embedded-book"
    @mouseup="handleMouseUp"
    :style="{
      fontSize: fontSize ? fontSize + 'px' : '16px',
      transform: `scale(${pageZoom ? pageZoom : 1})`,
    }"
  >
    <pageContent></pageContent>
  </div>
@@ -26,14 +22,6 @@
      cardList: [],
      isMouseDown: false,
    };
  },
  computed: {
    fontSize() {
      return this.$store.state.qiankun.fontSize;
    },
    pageZoom() {
      return this.$store.state.qiankun.scale / 100;
    },
  },
  mounted() {
  },
src/books/lifeCare/index.vue
@@ -135,6 +135,7 @@
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      renderSignMap: {}
    };
  },
  computed: {
@@ -301,7 +302,7 @@
          this.showCatalogList = [
            this.catalogLength - 2,
            this.catalogLength - 1,
            this.catalogLength,
            this.catalogLength
          ];
        } else {
          this.showCatalogList = [catalog - 1, catalog, catalog + 1];
@@ -322,6 +323,14 @@
      }
    },
    // å¤„理标记数据
    handelSignData(type, data) {
      if (!this.renderSignMap[type]) this.renderSignMap[type] = {};
      if (!this.renderSignMap[type][data.page])
        this.renderSignMap[type][data.page] = [];
      this.renderSignMap[type][data.page].push(data);
    },
    // æ¸²æŸ“标记
    renderSign(type, data) {
      const existence = (
@@ -332,29 +341,48 @@
        const pageDom = (
          this.container ? this.container : document
        ).querySelector(`[page="${data.page}"]`);
        // åˆ›å»º createTreeWalker è¿­ä»£å™¨ï¼Œç”¨äºŽéåŽ†æ–‡æœ¬èŠ‚ç‚¹ï¼Œä¿å­˜åˆ°ä¸€ä¸ªæ•°ç»„
        const treeWalker = document.createTreeWalker(
          pageDom,
          NodeFilter.SHOW_TEXT
        );
        const allTextNodes = [];
        let currentNode = treeWalker.nextNode();
        while (currentNode) {
          allTextNodes.push(currentNode);
          currentNode = treeWalker.nextNode();
        }
        for (let i = 0; i < allTextNodes.length; i++) {
          const textDom = allTextNodes[i];
          if (textDom.textContent.indexOf(data.txt) > -1) {
        let reg = new RegExp(`${data.txt}`, "ig");
        switch (type) {
          case "Highlight":
            // é«˜äº®
            pageDom.innerHTML = pageDom.innerHTML.replace(
                textDom.parentNode.innerHTML =
                  textDom.parentNode.innerHTML.replace(
              reg,
              `<span datatype="Highlight" dataid="${data.id}" style="background: ${data.color};" class="highLight" onclick="signClick('Highlight','${data.id}','${data.chapterNum}')">${data.txt}</span>`
            );
            break;
          case "Dashing":
            // åˆ’线
            pageDom.innerHTML = pageDom.innerHTML.replace(
                textDom.parentNode.innerHTML =
                  textDom.parentNode.innerHTML.replace(
              reg,
              `<span datatype="Dashing" dataid="${data.id}" style="text-decoration-color:${data.color};" class="underline" onclick="signClick('Dashing','${data.id}','${data.chapterNum}')">${data.txt}</span>`
            );
            break;
          case "Note":
            // ç¬”è®°
            pageDom.innerHTML = pageDom.innerHTML.replace(
                textDom.parentNode.innerHTML =
                  textDom.parentNode.innerHTML.replace(
              reg,
              `<span datatype="Note" dataid="${data.id}" style="border-bottom-color:${data.color}" class="notesline" onclick="signClick('Note','${data.id}','${data.chapterNum}')" onmouseover="noteHover('Note','${data.id}','${data.chapterNum}')" onmouseout="noteOut('Note')">${data.txt}<img src="${NoteIcon}"/></span>`
            );
            break;
            }
          }
        }
      }
    },
@@ -536,7 +564,7 @@
        if (entry.isIntersecting) {
          const target = entry.target;
          const page = target.getAttribute("page");
          if (this.loadPageList.indexOf(page) == -1) {
          if (this.loadPageList.indexOf(Number(page)) == -1) {
            const catalogDom = this.tool.getParentNodeByClassName(
              target,
              "chapter"
@@ -565,7 +593,16 @@
                }
              }
            }
            // æ·»åŠ é¡µç 
            this.loadPageList.push(Number(page));
            // æ¸²æŸ“这一页的标记
            for (const key in this.renderSignMap) {
              if (this.renderSignMap[key][page]) {
                this.renderSignMap[key][page].forEach((item) => {
                  this.renderSign(key, item);
                });
              }
            }
            if (this.loadPageList.length > 5) {
              // è¶…过5页
              this.loadPageList.shift();
src/books/sportsAndHealth/css/default.less
@@ -42,13 +42,13 @@
      justify-content: center;
      table {
        border: 1px solid #0aa2e9;
        border: 1px solid #95b2dc;
        border-collapse: collapse;
        padding: 0;
        margin: 0;
        tr th {
          border: 1px solid #0aa2e9;
          border: 1px solid #95b2dc;
          background-color: #b0a3cf;
          color: #f49a4c;
          text-align: center;
@@ -57,10 +57,11 @@
        }
        tr td {
          border: 1px solid #0aa2e9;
          border: 1px solid #95b2dc;
          text-align: center;
          padding: 3px 10px;
          font-size: 14px;
          line-height: 25px;
          input {
            cursor: pointer;
src/books/sportsAndHealth/index.vue
@@ -73,6 +73,7 @@
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      renderSignMap: {}
    };
  },
  computed: {
src/books/sportsAndHealth/view/chapter002.vue
@@ -94,49 +94,235 @@
                </thead>
                <tbody>
                  <tr>
                    <td>1. æˆ‘感觉快乐,心情舒畅</td>
                    <td><input :value="chapter002.tablexyx1.text1" type="checkbox" />5</td>
                    <td><input :value="chapter002.tablexyx1.text2" type="checkbox" />4</td>
                    <td><input :value="chapter002.tablexyx1.text3" type="checkbox" />3</td>
                    <td><input :value="chapter002.tablexyx1.text4" type="checkbox" />2</td>
                    <td><input :value="chapter002.tablexyx1.text5" type="checkbox" />1</td>
                    <td><input :value="chapter002.tablexyx1.text6" type="checkbox" />0</td>
                    <td style="text-align: left">1. æˆ‘感觉快乐,心情舒畅</td>
                    <td>
                      <input
                        @change="changeBox($event, 'text1')"
                        :checked="chapter002.tablexyx1.text1"
                        type="checkbox"
                      />5
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text2')"
                        :checked="chapter002.tablexyx1.text2"
                        type="checkbox"
                      />4
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text3')"
                        :checked="chapter002.tablexyx1.text3"
                        type="checkbox"
                      />3
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text4')"
                        :checked="chapter002.tablexyx1.text4"
                        type="checkbox"
                      />2
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text5')"
                        :checked="chapter002.tablexyx1.text5"
                        type="checkbox"
                      />1
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text6')"
                        :checked="chapter002.tablexyx1.text6"
                        type="checkbox"
                      />0
                    </td>
                  </tr>
                  <tr>
                    <td>2. æˆ‘感觉宁静和放松</td>
                    <td><input :value="chapter002.tablexyx1.text7" type="checkbox" />5</td>
                    <td><input :value="chapter002.tablexyx1.text8" type="checkbox" />4</td>
                    <td><input :value="chapter002.tablexyx1.text9" type="checkbox" />3</td>
                    <td><input :value="chapter002.tablexyx1.text10" type="checkbox" />2</td>
                    <td><input :value="chapter002.tablexyx1.text11" type="checkbox" />1</td>
                    <td><input :value="chapter002.tablexyx1.text12" type="checkbox" />0</td>
                    <td style="text-align: left">2. æˆ‘感觉宁静和放松</td>
                    <td>
                      <input
                        @change="changeBox($event, 'text7')"
                        :checked="chapter002.tablexyx1.text7"
                        type="checkbox"
                      />5
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text8')"
                        :checked="chapter002.tablexyx1.text8"
                        type="checkbox"
                      />4
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text9')"
                        :checked="chapter002.tablexyx1.text9"
                        type="checkbox"
                      />3
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text10')"
                        :checked="chapter002.tablexyx1.text10"
                        type="checkbox"
                      />2
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text11')"
                        :checked="chapter002.tablexyx1.text11"
                        type="checkbox"
                      />1
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text12')"
                        :checked="chapter002.tablexyx1.text12"
                        type="checkbox"
                      />0
                    </td>
                  </tr>
                  <tr>
                    <td>3. æˆ‘感觉充满活力,精力充沛</td>
                    <td>5</td>
                    <td>4</td>
                    <td>3</td>
                    <td>2</td>
                    <td>1</td>
                    <td>0</td>
                    <td style="text-align: left">
                      3. æˆ‘感觉充满活力,精力充沛
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text13')"
                        :checked="chapter002.tablexyx1.text13"
                        type="checkbox"
                      />5
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text14')"
                        :checked="chapter002.tablexyx1.text14"
                        type="checkbox"
                      />4
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text15')"
                        :checked="chapter002.tablexyx1.text15"
                        type="checkbox"
                      />3
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text16')"
                        :checked="chapter002.tablexyx1.text16"
                        type="checkbox"
                      />2
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text17')"
                        :checked="chapter002.tablexyx1.text17"
                        type="checkbox"
                      />1
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text18')"
                        :checked="chapter002.tablexyx1.text18"
                        type="checkbox"
                      />0
                    </td>
                  </tr>
                  <tr>
                    <td>4. æˆ‘睡醒时感到清醒,得到了足够休息</td>
                    <td>5</td>
                    <td>4</td>
                    <td>3</td>
                    <td>2</td>
                    <td>1</td>
                    <td>0</td>
                    <td style="text-align: left">
                      4. æˆ‘睡醒时感到清醒,得到了足够休息
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text19')"
                        :checked="chapter002.tablexyx1.text19"
                        type="checkbox"
                      />5
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text20')"
                        :checked="chapter002.tablexyx1.text20"
                        type="checkbox"
                      />4
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text21')"
                        :checked="chapter002.tablexyx1.text21"
                        type="checkbox"
                      />3
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text22')"
                        :checked="chapter002.tablexyx1.text22"
                        type="checkbox"
                      />2
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text23')"
                        :checked="chapter002.tablexyx1.text23"
                        type="checkbox"
                      />1
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text24')"
                        :checked="chapter002.tablexyx1.text24"
                        type="checkbox"
                      />0
                    </td>
                  </tr>
                  <tr>
                    <td>5. æˆ‘每天的生活充满了有趣的事情</td>
                    <td>5</td>
                    <td>4</td>
                    <td>3</td>
                    <td>2</td>
                    <td>1</td>
                    <td>0</td>
                    <td style="text-align: left">
                      5. æˆ‘每天的生活充满了有趣的事情
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text25')"
                        :checked="chapter002.tablexyx1.text25"
                        type="checkbox"
                      />5
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text26')"
                        :checked="chapter002.tablexyx1.text26"
                        type="checkbox"
                      />4
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text27')"
                        :checked="chapter002.tablexyx1.text27"
                        type="checkbox"
                      />3
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text28')"
                        :checked="chapter002.tablexyx1.text28"
                        type="checkbox"
                      />2
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text29')"
                        :checked="chapter002.tablexyx1.text29"
                        type="checkbox"
                      />1
                    </td>
                    <td>
                      <input
                        @change="changeBox($event, 'text30')"
                        :checked="chapter002.tablexyx1.text30"
                        type="checkbox"
                      />0
                    </td>
                  </tr>
                </tbody>
              </table>
@@ -200,59 +386,59 @@
                  <tbody>
                    <tr>
                      <td>1</td>
                      <td>正常健康</td>
                      <td>健康</td>
                      <td>健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text1')" type="checkbox" :checked="chapter002.tablebyb1.text1" />正常健康</td>
                      <td><input @change="changeByb($event,'text2')" type="checkbox" :checked="chapter002.tablebyb1.text2" />健康</td>
                      <td><input @change="changeByb($event,'text2')" type="checkbox" :checked="chapter002.tablebyb1.text2" />健康</td>
                      <td><input @change="changeByb($event,'text4')" type="checkbox" :checked="chapter002.tablebyb1.text4" />健康</td>
                    </tr>
                    <tr>
                      <td>2</td>
                      <td>悲观</td>
                      <td>不健康</td>
                      <td>健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text5')" type="checkbox" :checked="chapter002.tablebyb1.text5" />悲观</td>
                      <td><input @change="changeByb($event,'text6')" type="checkbox" :checked="chapter002.tablebyb1.text6" />不健康</td>
                      <td><input @change="changeByb($event,'text7')" type="checkbox" :checked="chapter002.tablebyb1.text7" />健康</td>
                      <td><input @change="changeByb($event,'text8')" type="checkbox" :checked="chapter002.tablebyb1.text8" />健康</td>
                    </tr>
                    <tr>
                      <td>3</td>
                      <td>社会方面不健康</td>
                      <td>健康</td>
                      <td>健康</td>
                      <td>不健康</td>
                      <td><input @change="changeByb($event,'text9')" type="checkbox" :checked="chapter002.tablebyb1.text9" />社会方面不健康</td>
                      <td><input @change="changeByb($event,'text10')" type="checkbox" :checked="chapter002.tablebyb1.text10" />健康</td>
                      <td><input @change="changeByb($event,'text11')" type="checkbox" :checked="chapter002.tablebyb1.text11" />健康</td>
                      <td><input @change="changeByb($event,'text12')" type="checkbox" :checked="chapter002.tablebyb1.text12" />不健康</td>
                    </tr>
                    <tr>
                      <td>4</td>
                      <td>患疑病症</td>
                      <td>不健康</td>
                      <td>健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text13')" type="checkbox" :checked="chapter002.tablebyb1.text13" />患疑病症</td>
                      <td><input @change="changeByb($event,'text14')" type="checkbox" :checked="chapter002.tablebyb1.text14" />不健康</td>
                      <td><input @change="changeByb($event,'text15')" type="checkbox" :checked="chapter002.tablebyb1.text15" />健康</td>
                      <td><input @change="changeByb($event,'text16')" type="checkbox" :checked="chapter002.tablebyb1.text16" />健康</td>
                    </tr>
                    <tr>
                      <td>5</td>
                      <td>身体不健康</td>
                      <td>健康</td>
                      <td>不健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text17')" type="checkbox" :checked="chapter002.tablebyb1.text17" />身体不健康</td>
                      <td><input @change="changeByb($event,'text18')" type="checkbox" :checked="chapter002.tablebyb1.text18" />健康</td>
                      <td><input @change="changeByb($event,'text19')" type="checkbox" :checked="chapter002.tablebyb1.text19" />不健康</td>
                      <td><input @change="changeByb($event,'text20')" type="checkbox" :checked="chapter002.tablebyb1.text20" />健康</td>
                    </tr>
                    <tr>
                      <td>6</td>
                      <td>长期受病折磨</td>
                      <td>不健康</td>
                      <td>不健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text21')" type="checkbox" :checked="chapter002.tablebyb1.text21" />长期受病折磨</td>
                      <td><input @change="changeByb($event,'text22')" type="checkbox" :checked="chapter002.tablebyb1.text22" />不健康</td>
                      <td><input @change="changeByb($event,'text23')" type="checkbox" :checked="chapter002.tablebyb1.text23" />不健康</td>
                      <td><input @change="changeByb($event,'text24')" type="checkbox" :checked="chapter002.tablebyb1.text24" />健康</td>
                    </tr>
                    <tr>
                      <td>7</td>
                      <td>乐观</td>
                      <td>健康</td>
                      <td>不健康</td>
                      <td>健康</td>
                      <td><input @change="changeByb($event,'text25')" type="checkbox" :checked="chapter002.tablebyb1.text25" />乐观</td>
                      <td><input @change="changeByb($event,'text26')" type="checkbox" :checked="chapter002.tablebyb1.text26" />健康</td>
                      <td><input @change="changeByb($event,'text27')" type="checkbox" :checked="chapter002.tablebyb1.text27" />不健康</td>
                      <td><input @change="changeByb($event,'text28')" type="checkbox" :checked="chapter002.tablebyb1.text28" />健康</td>
                    </tr>
                    <tr>
                      <td>8</td>
                      <td>患病严重</td>
                      <td>不健康</td>
                      <td>不健康</td>
                      <td>不健康</td>
                      <td><input @change="changeByb($event,'text29')" type="checkbox" :checked="chapter002.tablebyb1.text29" />患病严重</td>
                      <td><input @change="changeByb($event,'text30')" type="checkbox" :checked="chapter002.tablebyb1.text30" />不健康</td>
                      <td><input @change="changeByb($event,'text31')" type="checkbox" :checked="chapter002.tablebyb1.text31" />不健康</td>
                      <td><input @change="changeByb($event,'text32')" type="checkbox" :checked="chapter002.tablebyb1.text32" />不健康</td>
                    </tr>
                  </tbody>
                </table>
@@ -1022,11 +1208,26 @@
    return {
      chapter002:{
        tablexyx1:{},
      }
        tablebyb1:{}
      },
    };
  },
  created() {
    const localData = JSON.parse(localStorage.getItem("chapter002"));
    if (localData) {
      this.chapter002 = { ...Object.assign(this.chapter002, localData) };
      console.log(this.chapter002);
    }
  },
  methods: {
    changeBox(e, val) {
      this.chapter002.tablexyx1[val] = e.target.checked;
      localStorage.setItem("chapter002", JSON.stringify(this.chapter002));
    },
    changeByb(e, val) {
      this.chapter002.tablebyb1[val] = e.target.checked;
      localStorage.setItem("chapter002", JSON.stringify(this.chapter002));
    },
  },
};
</script>