Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

YM

2024-06-07 cc7bbbd9b6a859235c9985cc09836effc1157fe8

Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

 src/App.vue

@@ -72,7 +72,7 @@
        // embedded
        // english
        // artAndDance
        this.config.resourceCtx + "lifeCare"
        this.config.resourceCtx + "childHealth"
      );
      // 测试试读30页
      // this.activeBook.tryPageCount = 10;

 src/assets/methods/resources.js

@@ -1,19 +1,22 @@
import fileApi from '@/assets/js/middleGround/api/file'
export const getResourcePath = async(md5,appRefCode = "jingshieke") => {
  let path = ''
  await fileApi.getAliVod({
    md5,appRefCode
  }).then(res => {
    if(res.data.length) {
      path =  res.data
    } else {
      path =   process.env.VUE_APP_API_URL + '/file/api/ApiDownload?md5=' + md5
    }
  })
  return path
}
import fileApi from "@/assets/js/middleGround/api/file";
export const getResourcePath = async (md5, appRefCode = "jingshieke") => {
  let path = "";
  await fileApi
    .getAliVod({
      md5,
      appRefCode,
    })
    .then((res) => {
      if (res?.data != "" && res?.data != undefined) {
        path = res.data;
      } else {
        path = process.env.VUE_APP_API_URL + "/file/api/ApiDownload?md5=" + md5;
      }
    });
  return path;
};
const MT = {
  getResourcePath
}
  getResourcePath,
};

export default MT
export default MT;

 src/books/English/view/components/chapter001.vue

@@ -505,7 +505,12 @@
          <div class="bodystyle">
            <h3 id="c002" class="fl al-cn">
              <span class="bjh3">Listening</span>
              <audio :src="resource.listenOne" controls></audio>
              <audio
                :src="resource.listenOne"
                controls
                class="audio"
                @play="audioPlay"
              ></audio>
            </h3>
            <p>
              <b
@@ -514,19 +519,24 @@
                corresponding descriptions.</b
              >
            </p>
            <p class="center">
            <!-- <p class="center">
              <img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
            </p>
            </p> -->
            <div>
              <ul class="fl ju-bt">
                <li>Speakers　Chinese Cultural Symbols</li>
                <li style="width:40%;text-align:center">Descriptions</li>
              </ul>   
                <li style="width: 40%; text-align: center">Descriptions</li>
              </ul>
              <matching :rawData="rawData" :item="question"></matching>
            </div>
            <h3 id="c003" class="fl al-cn">
              <span class="bjh3">Reading</span>
              <audio :src="resource.readingOne" controls></audio>
              <audio
                :src="resource.readingOne"
                controls
                class="audio"
                @play="audioPlay"
              ></audio>
            </h3>
            <p>
              1.How was Chinese culture introduced to the world in ancient
@@ -735,6 +745,8 @@
              :src="resource.readingTwo"
              controls
              style="margin-left: 10px"
              class="audio"
              @play="audioPlay"
            ></audio>
            <p>wonderland /ˈwʌndəlænd/ <i>n.</i> 有许多奇妙事物的地方</p>
            <div class="bkbj">
@@ -2280,14 +2292,14 @@
            </div>
            <div class="w100 fl ju-cn">
              <div class="fl ju-ev mt-40" style="width: 80%">
                <button @click="setDropdownData" class="btn-border btn-w">
                  保存
                </button>
                <button
                  class="btn-border btn-w"
                  @click="handleDropdown('judge')"
                >
                  提交
                </button>
                <button @click="setDropdownData" class="btn-border btn-w">
                  保存
                </button>
                <button class="btn-border btn-w" @click="changeDropdown">
                  重做
@@ -2315,7 +2327,7 @@
import { getResourcePath } from "@/assets/methods/resources";
export default {
  name: "chapter-one",
  components:{matching},
  components: { matching },
  props: {
    showPageList: {
      type: Array,
@@ -2376,22 +2388,26 @@
        answer: [
          {
            id: "FB34",
            linkValue: "The clothing material is quite popular among Roman women inancient times.",
            linkValue:
              "The clothing material is quite popular among Roman women inancient times.",
            value: "Silk",
          },
          {
            id: "64D6",
            linkValue: "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
            linkValue:
              "It is one of China's must-see sights for visitors, which shows thewisdom of Chinese people.",
            value: "The Great Wall",
          },
          {
            id: "2ED4",
            linkValue: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
            linkValue:
              "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
            value: "Chinese Food",
          },
          {
            id: "44DE",
            linkValue: "It was first discovered and drank in China and my favorileLongjing tca is praduced near the West Lake in Hangzhou.",
            linkValue:
              "It was first discovered and drank in China and my favorileLongjing tca is praduced near the West Lake in Hangzhou.",
            value: "Chinese Tea",
          },
        ],
@@ -2415,7 +2431,6 @@
              oldId: "2ED4",
              txt: "It is very delicious and I like the hot and spicy Sichuan lavor hest.",
            },

          ],
          values: [
            {
@@ -2444,7 +2459,7 @@
        titleDescription: "1",
        userChoise: [],
        value: [],
        answerImg:require("@/books/English/assets/images/matching-one.png")
        answerImg: require("@/books/English/assets/images/matching-one.png"),
      },
      questionData: {
        warnUp: {
@@ -2740,6 +2755,9 @@
    saveData() {
      console.log(this.testData);
    },
    audioPlay() {
      this.$emit("closeMiniAudio");
    },
  },
};
</script>
@@ -2800,5 +2818,11 @@
select {
  height: 24px;
}

.mini-audio {
  width: 200px;
  height: 200px;
  position: fixed;
  right: 0;
  background-color: red;
}
</style>

 src/books/English/view/components/index.vue

@@ -14,16 +14,24 @@
      ></pageHeader>
      <chapterOne
        @saveCharacters="saveCharacters"
        @closeMiniAudio="closeMiniAudio"
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
      ></chapterOne>
    </div>
    <miniAudio
      :path="audioPath"
      :currentTime="currentTime"
      @closeMiniAudio="closeMiniAudio"
      ref="audioPlayer"
    ></miniAudio>
  </div>
</template>

<script>
import pageHeader from "./header.vue";
import chapterOne from "./chapter001.vue";
import miniAudio from "@/components/miniAudio/index.vue";
import NoteIcon from "@/assets/images/biji.png";
import _ from "lodash";
import Swiper from "swiper/bundle";
@@ -33,7 +41,7 @@
export default {
  data() {
    return {
      catalogLength: 2, // 总章节数
      catalogLength: 14, // 总章节数
      showCatalogList: [], // 显示的章节
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
@@ -42,8 +50,12 @@
      observer: null,
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      questionDataMap: {},
      renderSignMap: {},
      highlightData: null,
      audioPath: "",
      currentTime: null,
      videoList: [],
    };
  },
  computed: {
@@ -81,6 +93,14 @@
        }, 200);
      },
    },
    pageZoom: {
      handler(newVal, oldVal) {
        const scrollBox = (
          this.container ? this.container : document
        ).querySelector(".page-main");
        scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal;
      },
    },
  },
  mounted() {
    // 默认加载章节
@@ -107,6 +127,14 @@
        // 删除笔记、高亮、划线
        delSign: (data) => {
          this.delSign(data);
        },
        // 全文检索
        searchBookByKeyword: (keyword) => {
          return this.searchTextByPage(keyword);
        },
        // 跳转检索结果位置
        jumpSearchItem: (data) => {
          this.searchItemLocation(data);
        },
      });
    }
@@ -148,13 +176,41 @@
    //   });
    // }, 2000);
    //   }, 5000);
    // }, 1000);

    // const pageDom = (this.container ? this.container : document)
    //   .querySelector("#app")
    //   .querySelectorAll(".page-box");
    // 检索
    // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage");
    // 检索跳转
    // this.searchItemLocation({
    //   catalog: 2,
    //   page: 10,
    //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼（见图1-1）。骨骼是人体的支架，具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下，肌肉收缩牵动所附着的骨绕着关节转动，使身体产生各种动作。所以，运动系统具有运动、支持和保护等功能，幼年时期的骨骼还具有造血功能。 ",
    //   txtIndex: 57
    // });
    // }, 5000);
  },
  methods: {
    // setZoom1() {
    //   let scale = this.$store.state.qiankun.scale + 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // setZoom2() {
    //   let scale = this.$store.state.qiankun.scale - 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // 滚动监听
    scrollFun(event) {
      // 判断向上滚动还是向下滚动
      if (event.target.scrollTop > this.previousScrollTop) {
        this.getAduio()
        // 向下
        const currentScrollTop =
          event.target.scrollTop + event.target.offsetHeight;
@@ -178,6 +234,7 @@
          }
        }
      } else if (event.target.scrollTop < this.previousScrollTop) {
        this.handleAudio()
        // 向上
        const currentScrollTop = event.target.scrollTop;
        if (currentScrollTop <= this.loadThreshold) {
@@ -243,6 +300,10 @@

    // 渲染标记
    renderSign(type, data) {
      // 父层设置禁止渲染标记时不再进行渲染
      if (this.$store.state.qiankun.disableSign) {
        return false;
      }
      const existence = (
        this.container ? this.container : document
      ).querySelector(`[dataid="${data.id}"]`);
@@ -252,10 +313,7 @@
          this.container ? this.container : document
        ).querySelector(`[page="${data.page}"]`);
        // 创建 createTreeWalker 迭代器，用于遍历文本节点，保存到一个数组
        const treeWalker = document.createTreeWalker(
          pageDom,
          NodeFilter.SHOW_TEXT
        );
        const treeWalker = document.createTreeWalker(pageDom, NodeFilter.SHOW_TEXT);
        const allTextNodes = [];
        let currentNode = treeWalker.nextNode();
        while (currentNode) {
@@ -431,6 +489,7 @@
      });
    },
    getParentWithClass(element, className) {
      console.log(element, className, "element, className");
      while (element.parentElement) {
        element = element.parentElement;
        if (element.classList.contains(className)) {
@@ -480,11 +539,11 @@
              "chapter"
            );
            const catalog = catalogDom.getAttribute("num");
            // if (!this.questionData[page]) {
            // if (!this.questionDataMap[page]) {
            //   if (testData && testData[catalog]) {
            //     if (testData[catalog][page]) {
            //       if (Array.isArray(testData[catalog][page])) {
            //         this.questionData[page] = await getQuestionList(
            //         this.questionDataMap[page] = await getQuestionList(
            //           page,
            //           testData[catalog][page],
            //           this.config.activeBook
@@ -498,9 +557,9 @@
            //             this.config.activeBook
            //           );
            //         }
            //         this.questionData[page] = obj;
            //         this.questionDataMap[page] = obj;
            //       }
            //       console.log("题目", this.questionData);
            //       console.log("题目", this.questionDataMap);
            //     }
            //   }
            // }
@@ -513,6 +572,36 @@
                  this.renderSign(key, item);
                });
              }
            }
            // 处理高亮
            if (this.highlightData) {
              // 高亮行
              setTimeout(() => {
                // 获取页面所有text节点
                const pageTextList = document.createTreeWalker(target, NodeFilter.SHOW_TEXT);
                // 匹配关键字
                const allPageTextNodes = [];
                let currentNode = pageTextList.nextNode();
                while (currentNode) {
                  allPageTextNodes.push(currentNode);
                  currentNode = pageTextList.nextNode();
                }
                for (let i = 0; i < allPageTextNodes.length; i++) {
                  const textDom = allPageTextNodes[i];
                  let txtIndex = textDom.textContent.indexOf(
                    this.highlightData.txt
                  );
                  if (txtIndex > -1) {
                    textDom.parentNode.style.transition =
                      "background-color 0.8s";
                    textDom.parentNode.scrollIntoView();
                    textDom.parentNode.style.backgroundColor = "#79bbf0";
                    setTimeout(() => {
                      textDom.parentNode.style.backgroundColor = "";
                    }, 1000);
                  }
                }
              }, 100);
            }
            if (this.loadPageList.length > 5) {
              // 超过5页
@@ -565,40 +654,40 @@
      for (let i = 0; i < pptDoms.length; i++) {
        const dom = pptDoms[i];
        new Swiper(dom, {
        loop: false, // 无缝
        autoplay: false,
        paginationClickable: true,
        slidesPerView: 1, // 一组三个
        spaceBetween: 30, // 间隔
        // 如果需要前进后退按钮
        navigation: {
          nextEl: (this.container ? this.container : document).querySelector(
            ".swiper-button-next"
          ),
          prevEl: (this.container ? this.container : document).querySelector(
            ".swiper-button-prev"
          ),
        },
        // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
        observer: true,
        observeParents: true,
        on: {
          init:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
          loop: false, // 无缝
          autoplay: false,
          paginationClickable: true,
          slidesPerView: 1, // 一组三个
          spaceBetween: 30, // 间隔
          // 如果需要前进后退按钮
          navigation: {
            nextEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-next"
            ),
            prevEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-prev"
            ),
          },
          slideChange:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
          // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
          observer: true,
          observeParents: true,
          on: {
            init: (value) => {
              let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
              let totalPages = value.slides.length; // 获取总页数
              var paginationInfoEl = dom.querySelector(".pageBox");
              if (paginationInfoEl)
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            },
            slideChange: (value) => {
              let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
              let totalPages = value.slides.length; // 获取总页数
              var paginationInfoEl = dom.querySelector(".pageBox");
              if (paginationInfoEl)
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            },
          },
        },
      });
        });
      }
    },
    initViewer() {
@@ -617,12 +706,116 @@
        });
      }
    },
    // 点击事件：将生僻单词传给 主应用 从而调用词典功能
    // 根据关键字全文检索
    searchTextByPage(keyword) {
      const searchResult = [];
      let catalogIndex = 0;
      // 所有章节组件（每本书制作时单独配置）
      const pageData = {
        pageHeader,
        chapterOne,
      };
      // 遍历所有章节文件
      for (const key in pageData) {
        catalogIndex++;
        let pageComponent, pageExample;
        // 先渲染一次当前章节文件（这时页面的内容为空），获取页码信息
        pageComponent = Vue.extend(pageData[key]);
        pageExample = new pageComponent({
          propsData: {
            showPageList: [],
            questionData: {},
          },
        });
        pageExample.$mount(
          (this.container ? this.container : document).querySelector(
            "#searchContent"
          )
        );
        // 获取页码
        const pageDom = (this.container ? this.container : document)
          .querySelector("#searchDomBox")
          .querySelectorAll(".page-box");
        const pages = [];
        for (let i = 0; i < pageDom.length; i++) {
          const pageDomItem = pageDom[i];
          pages.push(Number(pageDomItem.getAttribute("page")));
        }
        // 获取页面结束，卸载销毁
        pageExample.$destroy();
        (this.container ? this.container : document).querySelector(
          "#searchDomBox"
        ).innerHTML = '<div id="searchContent"></div>';
        // 遍历页码
        if (pages.length) {
          for (let i = 0; i < pages.length; i++) {
            const pageNum = pages[i];
            // 动态渲染对应章节的页码
            pageComponent = Vue.extend(pageData[key]);
            pageExample = new pageComponent({
              propsData: {
                showPageList: [pageNum],
                questionData: {},
              },
            });
            pageExample.$mount(
              (this.container ? this.container : document).querySelector(
                "#searchContent"
              )
            );
            // 获取对应页面dom
            const thisPageDom = (this.container ? this.container : document)
              .querySelector("#searchDomBox")
              .querySelector(`[page="${pageNum}"]`);
            if (thisPageDom) {
              // 获取页面所有text节点
              const pageTextList = document.createTreeWalker(thisPageDom, NodeFilter.SHOW_TEXT);
              // 匹配关键字
              const allPageTextNodes = [];
              let currentNode = pageTextList.nextNode();
              while (currentNode) {
                allPageTextNodes.push(currentNode);
                currentNode = pageTextList.nextNode();
              }
              for (let i = 0; i < allPageTextNodes.length; i++) {
                const textDom = allPageTextNodes[i];
                let txtIndex = textDom.textContent.indexOf(keyword);
                if (txtIndex > -1) {
                  // 记录关键字所在页码、章节以及匹配到的段落
                  searchResult.push({
                    page: pageNum,
                    catalog: catalogIndex,
                    txt: textDom.textContent,
                    txtIndex: txtIndex,
                  });
                }
              }
              // 结束，卸载销毁
              pageExample.$destroy();
              (this.container ? this.container : document).querySelector(
                "#searchDomBox"
              ).innerHTML = '<div id="searchContent"></div>';
            }
          }
        }
      }
      // 输出搜索结果
      console.log(searchResult);
      return searchResult;
    },
    // 根据检索结果跳转对应位置并高亮
    searchItemLocation(data) {
      // 记录高亮信息
      this.highlightData = data;
      // 跳转
      this.gotoPage(data.catalog, data.page, () => {});
    },
        // 点击事件：将生僻单词传给 主应用 从而调用词典功能
    saveCharacters(event, word) {
      console.log("生僻字", event, word);
      if (this.$store.state.qiankun && this.$store.state.qiankun.chooseWords) {
        this.$store.state.qiankun.chooseWords({
          type:"word",
          type: "word",
          word,
          x: event.pageX,
          y: event.pageY,
@@ -630,10 +823,60 @@
      }
      // chooseWords
    },
    // 页面向下滚动，音频小窗播放功能
    getAduio() {
      let allVideo = (
        this.container ? this.container : document
      ).querySelectorAll(".audio");
      allVideo = Array.from(allVideo);
      this.videoList = allVideo;
      if (allVideo.length) {
        // 查找播放状态的最后一条音频
        const playAudio = allVideo
          .reverse()
          .find((item) => item.paused == false);
        if (playAudio) {
          const bottomGap = playAudio.getBoundingClientRect().bottom;
          if (bottomGap < 0) {
            playAudio.pause();
            this.audioPath = playAudio.src;
            this.currentTime = playAudio.currentTime;
          }
        }
      }
    },
    // 页面向上滚动，音频小窗回收
    handleAudio() {
      if (!this.audioPath) return false;
      let allVideo = (
        this.container ? this.container : document
      ).querySelectorAll(".audio");
      allVideo = Array.from(allVideo);
      if (allVideo.length) {
        //查找与小窗播放音频同源的页面audio DOM
        const playAudio = allVideo.find((item) => item.src == this.audioPath);
        if (playAudio) {
          const bottomGap = playAudio.getBoundingClientRect().bottom;
          if (bottomGap >= 0) {
            if (this.$refs.audioPlayer) {
              const playerState = this.$refs.audioPlayer.getVideoPlayer();
              this.audioPath = "";
              playAudio.currentTime = playerState.currentTime;
              if (!playerState.paused) playAudio.play();
            }
          }
        }
      }
    },
    // 关闭mini video
    closeMiniAudio() {
      this.audioPath = ''
    }
  },
  components: {
    pageHeader,
    chapterOne,
    miniAudio
  },
};
</script>

 src/books/artAndDance/assets/images/06.gif

 src/books/artAndDance/assets/images/07.gif

 src/books/artAndDance/assets/images/08.gif

 src/books/artAndDance/assets/images/09.gif

 src/books/artAndDance/assets/images/10-2.gif

 src/books/artAndDance/assets/images/chapter-five-header.png

 src/books/artAndDance/assets/images/chapter-four-header.png

 src/books/artAndDance/assets/images/chapter-three-header.png

 src/books/artAndDance/assets/images/crane.png

 src/books/artAndDance/assets/images/image26-1.jpg

 src/books/artAndDance/assets/images/image26-2.jpg

 src/books/artAndDance/assets/images/image26-3.jpg

 src/books/artAndDance/assets/images/image26-4.jpg

 src/books/artAndDance/assets/images/image27-1.jpg

 src/books/artAndDance/assets/images/image27-2.jpg

 src/books/artAndDance/assets/images/image27-3.jpg

 src/books/artAndDance/assets/images/image27-4.jpg

 src/books/artAndDance/assets/images/image28-1.jpg

 src/books/artAndDance/assets/images/image28-2.jpg

 src/books/artAndDance/assets/images/image28-3.jpg

 src/books/artAndDance/assets/images/image28-4.jpg

 src/books/artAndDance/assets/images/image29-1.jpg

 src/books/artAndDance/assets/images/image29-2.jpg

 src/books/artAndDance/assets/images/image29-3.jpg

 src/books/artAndDance/assets/images/image30-1.jpg

 src/books/artAndDance/assets/images/image30-2.jpg

 src/books/artAndDance/assets/images/image30-3.jpg

 src/books/artAndDance/assets/images/image30-4.jpg

 src/books/artAndDance/assets/images/rise.png

 src/books/artAndDance/assets/main.less

@@ -159,7 +159,7 @@
  h2.whleft2 {
    text-align: left;
    color: #af0206;
    font-size: 1.2em;
    font-size: 38px;
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    text-indent: 0em;
@@ -369,6 +369,12 @@
  .m0 {
    margin: 0;
  }
  .mr-8 {
    margin-right: 8px;
  }
  .mt-20 {
    margin-top: 20px;
  }
  .mt-40 {
    margin-top: 40px !important;
  }
@@ -400,9 +406,30 @@
    position: absolute;
    bottom: 0;
  }
  .m16-0 {
    margin: 16px 0;
  }
  .fm-son {
    font-family: "宋体", SimSun, sans-serif;
  }
  .auido-text {
    font-size: 22px;
    font-family: "FangSong", "PMingLiU", serif;
    font-weight: bold;
  }
}

/* 媒体查询做基础响应式布局 */
@media (max-width: 430px) {
  .ans-dance  {
    .page-box {
      min-height: 750px;
    }
    .pg-mh {
      min-height: 815px;
    }
  }
}
@media (max-width: 660px) {
  .ans-dance {
    /* 分页padding */
@@ -416,6 +443,16 @@
    .video-box {
      max-width: 260px;
    }
    .audio-box {
      margin-top: 20px;
      flex-wrap: wrap;
      li {
        width: 100%;
      }
      li:nth-child(2) {
        margin-top: 10px;
      }
    }
  }
}
@media (min-width: 660px) {
@@ -429,5 +466,15 @@
    .video-box {
      max-width: 370px;
    }
    .audio-box {
      margin-top: 20px;
      flex-wrap: nowrap;
      li {
        width: 58%;
      }
      li:nth-child(2) {
        margin-left: 10px;
      }
    }
  }
}

 src/books/artAndDance/view/components/chapter001.vue

@@ -1,13 +1,14 @@
<template>
  <div class="chapter" num="2">
    <div class="page-box" page="4" style="min-height: auto;">
    <div class="page-box" page="4" style="min-height: auto">
      <div v-if="showPageList.indexOf(4) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy1.jpg" />
        <img src="../../assets/images/01.gif" alt="" style="width: 53%;" class="cover-img">
        <audio></audio>
      </div>
    </div>
    <div class="page-box" page="5">
      <div v-if="showPageList.indexOf(5) > -1" class="pg-mh fl fl-cl ju-bt">
      <div v-if="showPageList.indexOf(5) > -1" class="pg-mh fl fl-cl">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
@@ -28,7 +29,7 @@
          <p class="block2 fz-26">配合步伐</p>
          <p class="block1 w70"><span class="ls fz-26">——上步晃手</span></p>
        </div>
        <ul>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 2 </span>
@@ -51,6 +52,24 @@
          <h2 class="lefth2" id="b002">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <ul class="fl fl-cl al-cn audio-box">
            <li class="fl al-cn">
              <span class="wh-nr auido-text mr-8 ">男童音</span>
              <audio :src="auidoPathOne" controls></audio>
            </li>
            <li class="fl al-cn mt-20 " >
              <span class="wh-nr auido-text mr-8 ">
                女童音
              </span>
              <audio :src="auidoPathTwo" controls></audio>
            </li>
          </ul>
          <h3 id="c003">黄鹤楼送孟浩然之广陵</h3>
          <p class="block2 fm-son ">〔唐〕李白</p>
          <p class="block2 m16-0">故人西辞黄鹤楼，</p>
          <p class="block2 m16-0">烟花三月下扬州。</p>
          <p class="block2 m16-0">孤帆远影碧空尽，</p>
          <p class="block2 m16-0">唯见长江天际流。</p>
          <video
            :src="videoPathOne"
            webkit-playsinline="true"
@@ -61,19 +80,8 @@
            x5-playsinline=""
            controls
            class="w100"
            style="margin-top: 40px;"
          ></video>
          <h3 id="c003">黄鹤楼送孟浩然之广陵</h3>
          <p class="block2">〔唐〕李白</p>
          <p class="block2">故人西辞黄鹤楼，</p>
          <p class="block2">烟花三月下扬州。</p>
          <p class="block2">孤帆远影碧空尽，</p>
          <p class="block2">唯见长江天际流。</p>
          <p class="center">
            <img class="img-g" alt="" src="image/i0007-1.jpg" />
          </p>
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="image/czysj.jpg" />
          </h2>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
@@ -96,6 +104,9 @@
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
          </h2>
          <div class="bj1">
            <p class="block">
              <img
@@ -120,7 +131,6 @@
              充分理解古诗表达的情感，根据已学舞蹈元素，创编带有送别意味的单一舞蹈动作或造型吧。
            </p>
          </div>
          <p class="center"><img class="img-0" alt="" src="image/ym.jpg" /></p>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
@@ -137,7 +147,7 @@
</template>

<script>
import getResourcePath from "@/assets/methods/resources";
import {getResourcePath} from "@/assets/methods/resources";
export default {
  name: "chapterOne",
  props: {
@@ -151,11 +161,16 @@
  data() {
    return {
      videoPathOne: "",
      auidoPathOne:"",
      auidoPathTwo:"",
    
    };
  },
  methods: {
    getVidoePath() {
      this.videoPathOne = getResourcePath("db8040667457cc6fc9b0209009acb316");
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("db8040667457cc6fc9b0209009acb316");
      this.auidoPathOne = await getResourcePath("2c5f6c69b0f9f7a3c03e473cb8c977f5");
      this.auidoPathTwo = await getResourcePath("e93c0fdde08be5a4386c8c863892a287");
    },
  },
};
@@ -176,4 +191,9 @@
  top: 33%;
  left: 23%;
}
.division-line {
  width: 2px;
  height: 100%;
  background-color: red;
}
</style>

 src/books/artAndDance/view/components/chapter002.vue

@@ -62,10 +62,22 @@
          <h2 class="lefth2" id="b006">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <ul class="fl fl-cl al-cn audio-box">
            <li class="fl al-cn">
              <span class="wh-nr auido-text mr-8">男童音</span>
              <audio :src="auidoPathOne" controls></audio>
            </li>
            <li class="fl al-cn mt-20">
              <span class="wh-nr auido-text mr-8">
                女童音
              </span>
              <audio :src="auidoPathTwo" controls></audio>
            </li>
          </ul>
          <h3 id="c006">亡羊补牢</h3>
          <p class="block2">席一元</p>
          <p class="block2">羊啊羊啊咩咩叫，有只小羊不见了。</p>
          <p class="block2">墙啊墙啊垒高高，墙上有个大窟窿。</p>
          <p class="block2 fm-son">席一元</p>
          <p class="block2 m16-0">羊啊羊啊咩咩叫，有只小羊不见了。</p>
          <p class="block2 m16-0">墙啊墙啊垒高高，墙上有个大窟窿。</p>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
@@ -88,8 +100,8 @@
          class="w100 mb-40"
        />
        <div class="padding-96">
          <p class="block2">羊啊羊啊咩咩叫，羊儿全都吓坏了。</p>
          <p class="block2">窟窿窟窿黑洞洞，快快补上才安心。</p>
          <p class="block2 m16-0">羊啊羊啊咩咩叫，羊儿全都吓坏了。</p>
          <p class="block2 m16-0">窟窿窟窿黑洞洞，快快补上才安心。</p>
          <p class="center">
            <!-- <img class="img-g" alt="" src="../../assets/images/i0012-1.jpg" /> -->
          </p>
@@ -103,6 +115,7 @@
            x5-playsinline=""
            controls
            class="w100"
            style="margin-top: 40px;"
          ></video>
          <h2 class="lefth2 mt-40" id="b007">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
@@ -134,7 +147,7 @@
            </div>
          <!-- <p class="center"><img class="img-0" alt="" src="../../assets/images/ym.jpg" /></p> -->
        </div>
        <ul class="pb-box">
        <ul style="margin-top: 20px">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 8 </span>
@@ -149,7 +162,7 @@
</template>

<script>
import getResourcePath from "@/assets/methods/resources";
import {getResourcePath} from "@/assets/methods/resources";
export default {
  name: "chapterTwo",
  props: {
@@ -174,12 +187,17 @@
      videoPathOne: "",
      num:0,
      addTimer:null,
      cutTimer:null
      cutTimer:null,
      auidoPathOne:"",
      auidoPathTwo:"",

    };
  },
  methods: {
    getVidoePath() {
      this.videoPathOne = getResourcePath("f6aaaed901868114d948031615250bed");
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("f6aaaed901868114d948031615250bed");
      this.auidoPathOne = await getResourcePath("39fd9a021904ed3de1b8b9e036777ea3");
      this.auidoPathTwo = await getResourcePath("a143777eff52ee24e53521d16afc85d9");
    },
    addNum() {
      this.addTimer =  setInterval(() => {

 src/books/artAndDance/view/components/chapter003.vue

New file
@@ -0,0 +1,184 @@
<template>
  <div class="chapter" num="4">
    <div class="page-box" page="12" style="min-height: auto">
      <div v-if="showPageList.indexOf(12) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
        <img src="../../assets/images/07.gif" alt="" style="width: 56%;" class="cover-gif">
      </div>
    </div>
    <div class="page-box" page="13">
      <div v-if="showPageList.indexOf(13) > -1" class="pg-mh fl fl-cl">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <p class="center">
            <img class="img-a" alt="" src="../../assets/images/06.gif" />
          </p>
          <h2 class="lefth2" id="b001">
            <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" />
          </h2>
          <h3 id="c001" class="fw-400 fz-26 mb-20">元素</h3>
          <p class="block2 fw-400 fz-26">双手按于身体两旁，模仿孩童天真可爱的样子</p>
          <p class="block1 w70"><span class="ls fz-26">——旁按手</span></p>
          <p class="block2 fz-26">单手旁按，指向1点方向</p>
          <p class="block1 w70"><span class="ls fz-26">——模仿钓鱼</span></p>
          <p class="block2 fz-26">单腿交替吸跳</p>
          <p class="block1 w70"><span class="ls fz-26">——吸跳步</span></p>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 10 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="14">
      <div v-if="showPageList.indexOf(14) > -1">
        <div>
          <img src="../../assets/images/chapter-three-header.png" class="w100" />
        </div>
        <div class="padding-96">
          <h3 id="c002">空间与方向</h3>
          <p class="block2">高、中空间</p>
          <p class="block2">1、2、4、8点方向</p>
          <h2 class="lefth2" id="b002">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <ul class="fl fl-cl al-cn audio-box">
            <li class="fl al-cn">
              <span class="wh-nr auido-text mr-8">男童音</span>
              <audio :src="auidoPathOne" controls></audio>
            </li>
            <li class="fl al-cn mt-20">
              <span class="wh-nr auido-text mr-8">
                女童音
              </span>
              <audio :src="auidoPathTwo" controls></audio>
            </li>
          </ul>
          <h3 id="c009">小儿垂钓</h3>
          <p class="block2 fm-son">〔唐〕胡令能</p>
          <p class="block2 m16-0">蓬头稚子学垂纶，</p>
          <p class="block2 m16-0">侧坐莓苔草映身。</p>
          <p class="block2 m16-0">路人借问遥招手，</p>
          <p class="block2 m16-0">怕得鱼惊不应人。</p>
          <video
            :src="videoPathOne"
            webkit-playsinline="true"
            x-webkit-airplay="true"
            playsinline="true"
            x5-video-orientation="h5"
            x5-video-player-fullscreen="true"
            x5-playsinline=""
            controls
            class="w100"
            style="margin-top: 40px;"
          ></video>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 11 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="15">
      <div v-if="showPageList.indexOf(15) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
          </h2>
          <div class="bj1">
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />运用所学舞蹈元素，设立孩童钓鱼的两个不同场景。
            </p>
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />学生自愿分组，每组自行设置与该诗情感相关的主题，在教师的引导下进行创编，并富有情感地展示出来。
            </p>
          </div>
          <h2 class="lefth2" id="b004">
            <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" />
          </h2>
          <div class="bj2">
            <p class="block">
              观察生活中钓鱼者的形象，根据已学舞蹈元素，创编出新的单一舞蹈动作或者造型吧。
            </p>
          </div>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 12 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import {getResourcePath} from "@/assets/methods/resources";
  export default {
    name:"chapterThree",
    props:{
      showPageList:{
        type:Array,
      }
    },
    mounted() {
      this.getVidoePath()
    },
    data() {
      return {
        videoPathOne:"",
        auidoPathOne:"",
        auidoPathTwo:""
      }
    },
    methods: {
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("36a2cffb28e494bea887f9a905b11863");
      this.auidoPathOne = await getResourcePath("85923e871441c541991be07fe4ce8771");
      this.auidoPathTwo = await getResourcePath("c018f7a6434abfac0b0e0da1174d643a");
    },
  },
  }
</script>

<style lang="less" scoped>
.cover-gif {
  position: absolute;
  top: 32%;
  left: 22%;

}
</style>

 src/books/artAndDance/view/components/chapter004.vue

New file
@@ -0,0 +1,188 @@
<template>
  <div class="chapter" num="5">
    <div class="page-box" page="16" style="min-height: auto;">
      <div v-if="showPageList.indexOf(16) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy4.jpg" />
        <img src="../../assets/images/08.gif" alt="" style="width: 55%;" class="cover-gif">
      </div>
    </div>
    <div class="page-box" page="17">
      <div v-if="showPageList.indexOf(17) > -1" class="pg-mh fl fl-cl ju-bt">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <p class="center">
            <img class="img-a" alt="" src="../../assets/images/09.gif" />
          </p>
          <h2 class="lefth2" id="b001">
            <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" />
          </h2>
          <h3 id="c001" class="fw-400 fz-26 mb-20">元素</h3>
          <p class="block2 fw-400 fz-26">男生、女生基本手形</p>
          <p class="block1 w70"><span class="ls fz-26">——兰花指（女）、掌形手（男）</span></p>
          <p class="block2 fz-26">单臂或双臂于体旁</p>
          <p class="block1 w70"><span class="ls fz-26">——单山膀、双山膀</span></p>
          <p class="block2 fz-26">单臂于头顶上方</p>
          <p class="block1 w70"><span class="ls fz-26">——单托掌</span></p>
          <p class="block2 fz-26">单手或双手于胸前</p>
          <p class="block1 w70"><span class="ls fz-26">——单按掌、胸前交叉按掌</span></p>
        </div>
        <ul>
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 14 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="18">
      <div v-if="showPageList.indexOf(18) > -1">
        <div>
          <img src="../../assets/images/chapter-four-header.png" class="w100" />
        </div>
        <div class="padding-96">
          <p class="block2 fz-26">单托掌和单山膀手</p>
          <p class="block1 w70"><span class="ls fz-26">——顺风旗</span></p>
          <p class="block2 fz-26">双臂同时体前划圆</p>
          <p class="block1 w70"><span class="ls fz-26">——双晃手</span></p>
          <h3 id="c002">空间与方向</h3>
          <p class="block2">高、中空间</p>
          <p class="block2">1-8点方向</p>
          <h2 class="lefth2" id="b002">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <ul class="fl fl-cl al-cn audio-box">
            <li class="fl al-cn">
              <span class="wh-nr auido-text mr-8">男童音</span>
              <audio :src="auidoPathOne" controls></audio>
            </li>
            <li class="fl al-cn mt-20">
              <span class="wh-nr auido-text mr-8">
                女童音
              </span>
              <audio :src="auidoPathTwo" controls></audio>
            </li>
          </ul>
          <h3 id="c012">寻隐者不遇</h3>
          <p class="block2 fm-son">〔唐〕贾岛</p>
          <p class="block2 m16-0">松下问童子，言师采药去。</p>
          <p class="block2 m16-0">只在此山中，云深不知处。</p>
          <video
            :src="videoPathOne"
            webkit-playsinline="true"
            x-webkit-airplay="true"
            playsinline="true"
            x5-video-orientation="h5"
            x5-video-player-fullscreen="true"
            x5-playsinline=""
            controls
            class="w100"
            style="margin-top: 40px;"
          ></video>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 15 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="19">
      <div v-if="showPageList.indexOf(19) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
          </h2>
          <div class="bj1">
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />运用所学舞蹈元素，设立询问他人的两个不同场景。
            </p>
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />学生自愿分组，每组自行设置与该诗情感相关的主题，在教师的引导下进行创编，并富有情感地展示出来。
            </p>
          </div>
          <h2 class="lefth2" id="b004">
            <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" />
          </h2>
          <div class="bj2">
            <p class="block">
              请思考一下，除了舞蹈中“只在此山中”的动作之外，还有什么舞蹈动作也可以体现这句诗的含义呢？
            </p>
          </div>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 16 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import {getResourcePath} from "@/assets/methods/resources";
  export default {
    name:"chapterFour",
    props:{
      showPageList:{
        type:Array,
      }
    },
    mounted() {
      this.getVidoePath()
    },
    data() {
      return {
        videoPathOne:"",
        auidoPathOne:"",
        auidoPathTwo:""
      }
    },
    methods: {
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("20b7d2311433c78a4fddf69d09a5fb43");
      this.auidoPathOne = await getResourcePath("a865ff99b91fa24d87ac81a883be54db");
      this.auidoPathTwo = await getResourcePath("66f3cc00d272a120514201e13e87fb9d");
    },
  },
  }
</script>

<style lang="less" scoped>
.cover-gif {
  position: absolute;
  top: 32%;
  left: 22%;

}
</style>

 src/books/artAndDance/view/components/chapter005.vue

New file
@@ -0,0 +1,243 @@
<template>
  <div class="chapter" num="6">
    <div class="page-box" page="20" style="min-height: auto">
      <div v-if="showPageList.indexOf(20) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy5.jpg" />
        <img
          src="../../assets/images/10-2.gif"
          alt=""
          style="width: 54%"
          class="cover-gif"
        />
      </div>
    </div>
    <div class="page-box" page="21">
      <div v-if="showPageList.indexOf(21) > -1" class="pg-mh fl fl-cl">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <ul class="fl fl-cl al-cn img-state" style="margin-top: 100px">
            <li style="width: 45%">
              <img
                src="../../assets/images/crane.png"
                alt=""
                class="w100"
                :style="{ opacity: (10 - num) / 10 }"
              />
            </li>
            <li style="width: 35%">
              <img
                src="../../assets/images/rise.png"
                alt=""
                class="w100"
                :style="{ opacity: num / 10 }"
              />
            </li>
          </ul>
          <p class="img">“西塞山前白鹭飞”动作</p>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 18 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="22">
      <div v-if="showPageList.indexOf(22) > -1">
        <div>
          <img
            src="../../assets/images/chapter-five-header.png"
            class="w100"
          />
        </div>
        <div class="padding-96">
          <h2 class="lefth2" id="b001">
            <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" />
          </h2>
          <h3 id="c001" class="fw-400 fz-26 mb-20">元素</h3>
          <p class="block2 fw-400 fz-26">模仿白鹭轻扇翅膀</p>
          <p class="block1 w70">
            <span class="ls fz-26">——小波浪手</span>
          </p>
          <p class="block2 fz-26">模仿白鹭翱翔</p>
          <p class="block1 w70">
            <span class="ls fz-26">——大波浪手</span>
          </p>
          <h3 id="c002">空间与方向</h3>
          <p class="block2">高、中、低空间</p>
          <p class="block2">1、2、3、7、8点方向</p>
          <h2 class="lefth2" id="b002">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <ul class="fl fl-cl al-cn audio-box">
            <li class="fl al-cn">
              <span class="wh-nr auido-text mr-8">男童音</span>
              <audio :src="auidoPathOne" controls></audio>
            </li>
            <li class="fl al-cn mt-20">
              <span class="wh-nr auido-text mr-8"> 女童音 </span>
              <audio :src="auidoPathTwo" controls></audio>
            </li>
          </ul>
          <h3 id="c015">渔歌子</h3>
          <p class="block2 fm-son">〔唐〕张志和</p>
          <p class="block2 m16-0">西塞山前白鹭飞，</p>
          <p class="block2 m16-0">桃花流水鳜鱼肥。</p>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 19 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="23">
      <div v-if="showPageList.indexOf(23) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <p class="block2 m16-0">青箬笠，绿蓑衣，</p>
          <p class="block2 m16-0">斜风细雨不须归。</p>
          <video
            :src="videoPathOne"
            webkit-playsinline="true"
            x-webkit-airplay="true"
            playsinline="true"
            x5-video-orientation="h5"
            x5-video-player-fullscreen="true"
            x5-playsinline=""
            controls
            class="w100"
            style="margin:38px 0"
          ></video>
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
          </h2>
          <div class="bj1">
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />运用所学舞蹈元素，设立白鹭飞翔的两个不同场景。
            </p>
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />学生自愿分组，每组自行设置与该诗情感相关的主题，在教师的引导下进行创编，并富有情感地展示出来。
            </p>
          </div>
          <h2 class="lefth2" id="b004">
            <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" />
          </h2>
          <div class="bj2">
            <p class="block">
              根据本单元所学的舞蹈元素以及古诗寓意，发挥想象，创编新的单一舞蹈动作或造型吧。
            </p>
          </div>
        </div>
        <ul>
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 20 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import { getResourcePath } from "@/assets/methods/resources";
export default {
  name: "chapterFive",
  props: {
    showPageList: {
      type: Array,
    },
  },
  mounted() {
    this.getVidoePath();
    this.addNum();
  },
  data() {
    return {
      videoPathOne: "",
      auidoPathOne: "",
      auidoPathTwo: "",
      num: 0,
    };
  },
  unmounted() {
    if (this.addTimer) {
      clearInterval(this.addTimer);
    }
    if (this.cutTimer) {
      clearInterval(this.cutTimer);
    }
  },
  methods: {
    async getVidoePath() {
      this.videoPathOne = await getResourcePath(
        "97758c885b8668f42c9df0b3ff030672"
      );
      this.auidoPathOne = await getResourcePath(
        "aed4d7b398283b35df0ca46f7c0bbdd4"
      );
      this.auidoPathTwo = await getResourcePath(
        "ec8b7f69df81b1d6230968ad2313132c"
      );
    },
    addNum() {
      this.addTimer = setInterval(() => {
        if (this.num < 10) {
          this.num++;
        } else {
          clearInterval(this.addTimer);
          this.cutNum();
        }
      }, 200);
    },
    cutNum() {
      this.cutTimer = setInterval(() => {
        if (this.num > 0) {
          this.num--;
        } else {
          clearInterval(this.cutTimer);
          this.addNum();
        }
      }, 200);
    },
  },
};
</script>

<style lang="less" scoped>
.cover-gif {
  position: absolute;
  top: 32%;
  left: 22%;
}
</style>

 src/books/artAndDance/view/components/chapter006.vue

New file
@@ -0,0 +1,333 @@
<template>
  <div class="chapter" num="7">
    <div class="page-box" page="24" style="min-height: auto">
      <div v-if="showPageList.indexOf(24) > -1">
        <img class="img-0" alt="" src="../../assets/images/dzk.jpg" />
      </div>
    </div>
    <div class="page-box" page="25">
      <div v-if="showPageList.indexOf(25) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="whleft2" id="b021">第一单元 黄鹤楼送孟浩然之广陵</h2>
          <div class="banshi openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image26-1.jpg"
                      alt="1 “故人西辞黄鹤楼”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image26-2.jpg"
                      alt="2 “烟花三月下扬州”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image26-3.jpg"
                      alt="3 “孤帆远影碧空尽”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image26-4.jpg"
                      alt="4 “唯见长江天际流”动作"
                    />
                  </div>
                </div>
              </div>
              <div class="swiper-pagination"></div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
        </div>
        <ul>
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 22 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="26">
      <div v-if="showPageList.indexOf(26) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="whleft2" id="b022">第二单元 亡羊补牢</h2>
          <div class="banshi openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image27-1.jpg"
                      alt="1 “羊角式”舞姿"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image27-2.jpg"
                      alt="2 模仿“窟窿”舞姿"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image27-3.jpg"
                      alt="3 “捂嘴状”舞姿"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image27-4.jpg"
                      alt="4 “双人配合”舞姿"
                    />
                  </div>
                </div>
              </div>
              <div class="swiper-pagination"></div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 23 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="27">
      <div v-if="showPageList.indexOf(27) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="whleft2" id="b023">第三单元 小儿垂钓</h2>
          <div class="banshi openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image28-1.jpg"
                      alt="1 吸跳步"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image28-2.jpg"
                      alt="2 “侧坐莓苔草映身”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image28-3.jpg"
                      alt="3 “路人借问遥招手”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image28-4.jpg"
                      alt="4 模仿“钓鱼”舞姿"
                    />
                  </div>
                </div>
              </div>
              <div class="swiper-pagination"></div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 24 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="28">
      <div v-if="showPageList.indexOf(28) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="whleft2" id="b024">第四单元 寻隐者不遇</h2>
          <div class="banshi openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image29-1.jpg"
                      alt="1 “松下问童子”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image29-2.jpg"
                      alt="2 “言师采药去”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image29-3.jpg"
                      alt="3 “云深不知处”动作"
                    />
                  </div>
                </div>
              </div>
              <div class="swiper-pagination"></div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 25 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="29">
      <div v-if="showPageList.indexOf(29) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="whleft2" id="b025">第五单元 渔歌子</h2>
          <div class="banshi openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image30-1.jpg"
                      alt="1 吸跳步"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image30-2.jpg"
                      alt="2 “侧坐莓苔草映身”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image30-3.jpg"
                      alt="3 “路人借问遥招手”动作"
                    />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img
                      src="../../assets/images/image30-4.jpg"
                      alt="4 模仿“钓鱼”舞姿"
                    />
                  </div>
                </div>
              </div>
              <div class="swiper-pagination"></div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
        </div>
        <ul >
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 26 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "chapterSix",
  props: {
    showPageList: {
      type: Array,
    },
  },
};
</script>

<style lang="less" scoped>
.banshi {
  width: 100%;
  height: 800px;
}
</style>

 src/books/artAndDance/view/components/header.vue

@@ -11,12 +11,12 @@
    </div>
    <div class="page-box" page="3">
      <div v-if="showPageList.indexOf(3) > -1">
        <ul class="fl fl-cl ju-bt" style="min-height: 1150px">
        <ul class="fl fl-cl ju-bt pg-mh">
          <li>
            <img src="../../assets/images/pageHeader.png" alt="" class="w100" />
          </li>
          <li>
            <div class="bodystyle">
            <div class="bodystyle" style="margin-bottom: 100px">
              <h1 id="a003" class="front">编委会</h1>
              <hr />
              <p>顾　　问：<span class="kaiti">彭吉象　吕艺生</span></p>
@@ -48,7 +48,7 @@
              <p>　　　　　</p>
              <p>　　　　　</p>
            </div>
            <p class="center">
            <p class="center pb-box">
              <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
            </p>
          </li>

 src/books/artAndDance/view/components/index.vue

@@ -1,5 +1,8 @@
<template>
  <div class="page-main" @scroll="throttledScrollHandler">
    <div id="searchDomBox" style="display: none">
      <div id="searchContent"></div>
    </div>
    <div
      class="page-content"
      :style="{
@@ -13,7 +16,6 @@
        :showPageList="loadPageList"
      ></pageHeader>
      <chapterOne
        @saveCharacters="saveCharacters"
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
      ></chapterOne>
@@ -22,7 +24,24 @@
        :showPageList="loadPageList"
      >
      </chapterTwo>
      <chapterThree
      v-if="showCatalogList.indexOf(4) > -1"
        :showPageList="loadPageList"
      ></chapterThree>
      <chapterFour
      v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
      ></chapterFour>
      <chapterFive
      v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
      ></chapterFive>
      <chapterSix
        v-if="showCatalogList.indexOf(7) > -1"
        :showPageList="loadPageList"
      ></chapterSix>
    </div>

  </div>
</template>

@@ -30,6 +49,10 @@
import pageHeader from "./header.vue";
import chapterOne from "./chapter001.vue";
import chapterTwo from "./chapter002.vue";
import chapterThree from "./chapter003.vue"
import chapterFour from './chapter004.vue'
import chapterFive from './chapter005.vue'
import chapterSix from './chapter006.vue'
import NoteIcon from "@/assets/images/biji.png";
import _ from "lodash";
import Swiper from "swiper/bundle";
@@ -39,7 +62,7 @@
export default {
  data() {
    return {
      catalogLength: 3, // 总章节数
      catalogLength: 7, // 总章节数
      showCatalogList: [], // 显示的章节
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
@@ -48,8 +71,9 @@
      observer: null,
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      questionDataMap: {},
      renderSignMap: {},
      highlightData: null,
    };
  },
  computed: {
@@ -87,6 +111,14 @@
        }, 200);
      },
    },
    pageZoom: {
      handler(newVal, oldVal) {
        const scrollBox = (
          this.container ? this.container : document
        ).querySelector(".page-main");
        scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal;
      },
    },
  },
  mounted() {
    // 默认加载章节
@@ -113,6 +145,14 @@
        // 删除笔记、高亮、划线
        delSign: (data) => {
          this.delSign(data);
        },
        // 全文检索
        searchBookByKeyword: (keyword) => {
          return this.searchTextByPage(keyword);
        },
        // 跳转检索结果位置
        jumpSearchItem: (data) => {
          this.searchItemLocation(data);
        },
      });
    }
@@ -154,9 +194,36 @@
    //   });
    // }, 2000);
    //   }, 5000);
    // }, 1000);

    // const pageDom = (this.container ? this.container : document)
    //   .querySelector("#app")
    //   .querySelectorAll(".page-box");
    // 检索
    // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage");
    // 检索跳转
    // this.searchItemLocation({
    //   catalog: 2,
    //   page: 10,
    //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼（见图1-1）。骨骼是人体的支架，具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下，肌肉收缩牵动所附着的骨绕着关节转动，使身体产生各种动作。所以，运动系统具有运动、支持和保护等功能，幼年时期的骨骼还具有造血功能。 ",
    //   txtIndex: 57
    // });
    // }, 5000);
  },
  methods: {
    // setZoom1() {
    //   let scale = this.$store.state.qiankun.scale + 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // setZoom2() {
    //   let scale = this.$store.state.qiankun.scale - 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // 滚动监听
    scrollFun(event) {
      // 判断向上滚动还是向下滚动
@@ -249,6 +316,10 @@

    // 渲染标记
    renderSign(type, data) {
      // 父层设置禁止渲染标记时不再进行渲染
      if (this.$store.state.qiankun.disableSign) {
        return false;
      }
      const existence = (
        this.container ? this.container : document
      ).querySelector(`[dataid="${data.id}"]`);
@@ -258,10 +329,7 @@
          this.container ? this.container : document
        ).querySelector(`[page="${data.page}"]`);
        // 创建 createTreeWalker 迭代器，用于遍历文本节点，保存到一个数组
        const treeWalker = document.createTreeWalker(
          pageDom,
          NodeFilter.SHOW_TEXT
        );
        const treeWalker = document.createTreeWalker(pageDom, NodeFilter.SHOW_TEXT);
        const allTextNodes = [];
        let currentNode = treeWalker.nextNode();
        while (currentNode) {
@@ -437,6 +505,7 @@
      });
    },
    getParentWithClass(element, className) {
      console.log(element, className, "element, className");
      while (element.parentElement) {
        element = element.parentElement;
        if (element.classList.contains(className)) {
@@ -486,11 +555,11 @@
              "chapter"
            );
            const catalog = catalogDom.getAttribute("num");
            // if (!this.questionData[page]) {
            // if (!this.questionDataMap[page]) {
            //   if (testData && testData[catalog]) {
            //     if (testData[catalog][page]) {
            //       if (Array.isArray(testData[catalog][page])) {
            //         this.questionData[page] = await getQuestionList(
            //         this.questionDataMap[page] = await getQuestionList(
            //           page,
            //           testData[catalog][page],
            //           this.config.activeBook
@@ -504,9 +573,9 @@
            //             this.config.activeBook
            //           );
            //         }
            //         this.questionData[page] = obj;
            //         this.questionDataMap[page] = obj;
            //       }
            //       console.log("题目", this.questionData);
            //       console.log("题目", this.questionDataMap);
            //     }
            //   }
            // }
@@ -519,6 +588,36 @@
                  this.renderSign(key, item);
                });
              }
            }
            // 处理高亮
            if (this.highlightData) {
              // 高亮行
              setTimeout(() => {
                // 获取页面所有text节点
                const pageTextList = document.createTreeWalker(target, NodeFilter.SHOW_TEXT);
                // 匹配关键字
                const allPageTextNodes = [];
                let currentNode = pageTextList.nextNode();
                while (currentNode) {
                  allPageTextNodes.push(currentNode);
                  currentNode = pageTextList.nextNode();
                }
                for (let i = 0; i < allPageTextNodes.length; i++) {
                  const textDom = allPageTextNodes[i];
                  let txtIndex = textDom.textContent.indexOf(
                    this.highlightData.txt
                  );
                  if (txtIndex > -1) {
                    textDom.parentNode.style.transition =
                      "background-color 0.8s";
                    textDom.parentNode.scrollIntoView();
                    textDom.parentNode.style.backgroundColor = "#79bbf0";
                    setTimeout(() => {
                      textDom.parentNode.style.backgroundColor = "";
                    }, 1000);
                  }
                }
              }, 100);
            }
            if (this.loadPageList.length > 5) {
              // 超过5页
@@ -623,24 +722,124 @@
        });
      }
    },
    // 点击事件：将生僻单词传给 主应用 从而调用词典功能
    saveCharacters(event, word) {
      console.log("生僻字", event, word);
      if (this.$store.state.qiankun && this.$store.state.qiankun.chooseWords) {
        this.$store.state.qiankun.chooseWords({
          type: "word",
          word,
          x: event.pageX,
          y: event.pageY,
    // 根据关键字全文检索
    searchTextByPage(keyword) {
      const searchResult = [];
      let catalogIndex = 0;
      // 所有章节组件（每本书制作时单独配置）
      const pageData = {
        pageHeader,
        chapterOne,
        chapterTwo,
        chapterThree,
        chapterFour,
        chapterFive,
        chapterSix,
      };
      // 遍历所有章节文件
      for (const key in pageData) {
        catalogIndex++;
        let pageComponent, pageExample;
        // 先渲染一次当前章节文件（这时页面的内容为空），获取页码信息
        pageComponent = Vue.extend(pageData[key]);
        pageExample = new pageComponent({
          propsData: {
            showPageList: [],
            questionData: {},
          },
        });
        pageExample.$mount(
          (this.container ? this.container : document).querySelector(
            "#searchContent"
          )
        );
        // 获取页码
        const pageDom = (this.container ? this.container : document)
          .querySelector("#searchDomBox")
          .querySelectorAll(".page-box");
        const pages = [];
        for (let i = 0; i < pageDom.length; i++) {
          const pageDomItem = pageDom[i];
          pages.push(Number(pageDomItem.getAttribute("page")));
        }
        // 获取页面结束，卸载销毁
        pageExample.$destroy();
        (this.container ? this.container : document).querySelector(
          "#searchDomBox"
        ).innerHTML = '<div id="searchContent"></div>';
        // 遍历页码
        if (pages.length) {
          for (let i = 0; i < pages.length; i++) {
            const pageNum = pages[i];
            // 动态渲染对应章节的页码
            pageComponent = Vue.extend(pageData[key]);
            pageExample = new pageComponent({
              propsData: {
                showPageList: [pageNum],
                questionData: {},
              },
            });
            pageExample.$mount(
              (this.container ? this.container : document).querySelector(
                "#searchContent"
              )
            );
            // 获取对应页面dom
            const thisPageDom = (this.container ? this.container : document)
              .querySelector("#searchDomBox")
              .querySelector(`[page="${pageNum}"]`);
            if (thisPageDom) {
              // 获取页面所有text节点
              const pageTextList = document.createTreeWalker(thisPageDom, NodeFilter.SHOW_TEXT);
              // 匹配关键字
              const allPageTextNodes = [];
              let currentNode = pageTextList.nextNode();
              while (currentNode) {
                allPageTextNodes.push(currentNode);
                currentNode = pageTextList.nextNode();
              }
              for (let i = 0; i < allPageTextNodes.length; i++) {
                const textDom = allPageTextNodes[i];
                let txtIndex = textDom.textContent.indexOf(keyword);
                if (txtIndex > -1) {
                  // 记录关键字所在页码、章节以及匹配到的段落
                  searchResult.push({
                    page: pageNum,
                    catalog: catalogIndex,
                    txt: textDom.textContent,
                    txtIndex: txtIndex,
                  });
                }
              }
              // 结束，卸载销毁
              pageExample.$destroy();
              (this.container ? this.container : document).querySelector(
                "#searchDomBox"
              ).innerHTML = '<div id="searchContent"></div>';
            }
          }
        }
      }
      // chooseWords
      // 输出搜索结果
      console.log(searchResult);
      return searchResult;
    },
    // 根据检索结果跳转对应位置并高亮
    searchItemLocation(data) {
      // 记录高亮信息
      this.highlightData = data;
      // 跳转
      this.gotoPage(data.catalog, data.page, () => {});
    },
  },
  components: {
    pageHeader,
    chapterOne,
    chapterTwo,
    chapterThree,
    chapterFour,
    chapterFive,
    chapterSix,
  },
};
</script>

 src/books/childHealth/view/components/pageHeader/evenHeader.vue

File was deleted

 src/books/childHealth/view/components/pageHeader/oddHeader.vue

File was deleted

 src/books/childHealth/view/content/components/chapter0004.vue

@@ -46,7 +46,11 @@
          专题导学
        </h6>
        <p class="blockh6 m0-t0 openImgBox">
          <img src="../../../assets/images/chapterFour/0094-1.jpg" alt="" class="w100 mt-20">
          <img
            src="../../../assets/images/chapterFour/0094-1.jpg"
            alt=""
            class="w100 mt-20"
          />
        </p>
      </div>
    </div>
@@ -71,15 +75,28 @@
              专题四学习主题二 学前儿童卫生与保健自主学习任务单 学习指南</span
            >
            <span class="t0 svg-btn" @click="changeResources('learnTableOne')">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 19.28 20.563">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                width="16"
                height="17"
                viewBox="0 0 19.28 20.563"
              >
                <g transform="translate(-109.056 -82.941)">
                  <path class="a"
                  <path
                    class="a"
                    d="M3439.656-15185.7h-12.643a1.815,1.815,0,0,1-1.816-1.81v-16.944a1.83,1.83,0,0,1,1.816-1.809h15.674a1.8,1.8,0,0,1,1.79,1.809v13.93h-4.217a.6.6,0,0,0-.6.6v4.217h0Zm-9.819-2.764a.5.5,0,0,0-.5.5.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5.5.5,0,0,0-.5-.5Zm0-2a.5.5,0,0,0-.5.5.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5.5.5,0,0,0-.5-.5Zm1.393-8.525a2.416,2.416,0,0,0-2.416,2.411,2.421,2.421,0,0,0,2.416,2.42h.111a1.8,1.8,0,0,0,1.1,1.1,1.809,1.809,0,0,0,.6.107,1.808,1.808,0,0,0,1.7-1.206h4.072l-.172.172a.635.635,0,0,0-.179.454.569.569,0,0,0,.179.4.637.637,0,0,0,.435.176.6.6,0,0,0,.424-.176l1.2-1.214a.618.618,0,0,0,0-.858l-1.2-1.187a.619.619,0,0,0-.431-.176.6.6,0,0,0-.427.176.615.615,0,0,0,0,.854l.172.176h-4.072a1.8,1.8,0,0,0-1.1-1.1,1.755,1.755,0,0,0-.6-.1,1.808,1.808,0,0,0-1.7,1.206h-.111a.554.554,0,0,1-.145-.016,1.2,1.2,0,0,1-.84-.4,1.217,1.217,0,0,1-.3-.878,1.2,1.2,0,0,1,1.206-1.137.407.407,0,0,1,.069,0h3.729a1.807,1.807,0,0,0,1.118,1.114,1.816,1.816,0,0,0,.576.091,1.789,1.789,0,0,0,1.7-1.205h.309a2.415,2.415,0,0,0,1.679-.775,2.407,2.407,0,0,0,.637-1.729,2.411,2.411,0,0,0-2.419-2.324h-6.213a1.821,1.821,0,0,0-1.107-1.1,1.8,1.8,0,0,0-.6-.1,1.814,1.814,0,0,0-1.706,1.2,1.8,1.8,0,0,0,.077,1.389,1.787,1.787,0,0,0,1.026.92,1.841,1.841,0,0,0,.6.1,1.807,1.807,0,0,0,1.706-1.2h6.266a1.179,1.179,0,0,1,.836.4,1.22,1.22,0,0,1,.305.874,1.213,1.213,0,0,1-1.214,1.146h-.172a1.8,1.8,0,0,0-1.118-1.118,1.711,1.711,0,0,0-.576-.1,1.8,1.8,0,0,0-1.706,1.214Z"
                    transform="translate(-3316.14 15289.201)" />
                  <path class="a"
                    transform="translate(-3316.14 15289.201)"
                  />
                  <path
                    class="a"
                    d="M316.806,239.727a.6.6,0,1,0,.6-.6A.6.6,0,0,0,316.806,239.727Zm-5.421-4.207a.6.6,0,1,0,.6.6A.587.587,0,0,0,311.385,235.52Zm2.4,8.438a.607.607,0,1,0-.6-.613A.621.621,0,0,0,313.789,243.958Z"
                    transform="translate(-196.896 -148.921)" />
                  <path class="a" d="M763.392,793.79l3.262-3.262h-3.262Z" transform="translate(-638.661 -690.634)" />
                    transform="translate(-196.896 -148.921)"
                  />
                  <path
                    class="a"
                    d="M763.392,793.79l3.262-3.262h-3.262Z"
                    transform="translate(-638.661 -690.634)"
                  />
                </g>
              </svg>
            </span>
@@ -156,6 +173,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.生长发育形态指标有哪些?</span>
                <textarea
@@ -165,6 +183,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">3.生理机能指标有哪些?</span>
                <textarea
@@ -174,6 +193,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.评价学前儿童生长发育常用的方法有哪些?</span
@@ -185,6 +205,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">5.什么是骨骼年龄?</span>
                <textarea
@@ -194,6 +215,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.我国卫生部规定的儿童定期健康检查的时间是哪些时候?</span
@@ -205,6 +227,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">7.儿童健康检查应包括哪些项目?</span>
                <textarea
@@ -214,6 +237,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.身高、体重、头胸围、坐高的生物学特征及卫生学意义是什么?</span
@@ -225,6 +249,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >9.怎样测量学前儿童的头胸围、身高以及体重?</span
@@ -236,6 +261,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -262,6 +288,7 @@
              placeholder="请输入内容"
              maxlength="400"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题主要讲述学前儿童生长发育的评价指标、评价标准和评价方法以及定期健康检查的相关知识，以期为家长和幼教工作者对学前儿童进行身体健康评价提供指导。
@@ -317,9 +344,7 @@
    <div class="page-box" page="91">
      <div v-if="showPageList.indexOf(91) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">83</span>
        </div>
        <div class="padding-96">
@@ -372,7 +397,7 @@
              体重测量应在早晨、空腹、便后进行。儿童可裸体或穿背心、短裤，也可在测后扣除衣服质量。
            </p> -->
            <p>（2）身高（长）</p>
    

            <p>
              身高（长）是人体站立时颅顶到脚跟（与地面相及处）的垂直高度。3岁以下儿童立位测量不准确，应采用仰卧位测量，故身高又称身长；3岁以后可立位测量，称身高。立位与仰卧位测量值相差1～2厘米。
            </p>
@@ -409,7 +434,7 @@
            <p>
              3岁以上儿童用身高计测量身高。在使用身高计测量时，受测儿童脱去鞋帽，取立正姿势站在身高计的底板上，头部保持正直，两眼平视前方，胸部稍挺起，两臂自然下垂，手指并拢，脚跟靠拢，足尖分开，足跟、臀部、两肩胛间三点同时靠在身高计的垂直立柱上，然后测量。测量者将滑侧板轻轻移动，直至接触受测儿童头顶，读立柱上数字，误差不得超过0.1厘米。
            </p>
    

            <div class="fl fl-around">
              <div class="left" style="width: 38%">
                <p>
@@ -439,11 +464,11 @@
            </p>
          </div>
        </div>
    </div>
      </div>
    </div>
    <!-- 84 -->
    <div class="page-box" page="92">
      <div v-if="showPageList.indexOf(92) > -1">      
      <div v-if="showPageList.indexOf(92) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -508,15 +533,13 @@
            生长发育的主要形态指标还包括代表营养状况的臂围、腹围和各部位皮褶厚度等。
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 85 -->
    <div class="page-box" page="93">
      <div v-if="showPageList.indexOf(93) > -1">      
      <div v-if="showPageList.indexOf(93) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">85</span>
        </div>
        <div class="padding-96">
@@ -574,11 +597,11 @@
            尿液一般性状检查包括尿液的气味、尿量、颜色、透明度等。尿液有腐臭味，可见于泌尿系统化脓菌感染；尿量减少，可见于急性肾小球肾炎、高热、呕吐和腹泻；尿液颜色
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 86 -->
    <div class="page-box" page="94">
      <div v-if="showPageList.indexOf(94) > -1">      
      <div v-if="showPageList.indexOf(94) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -620,15 +643,13 @@
            理想标准所选样本是生活在最适宜环境中的儿童，喂养和膳食安排合理，营养供给充足，有良好的生活居住环境，可以得到良好的医疗保健服务。在这一环境中生活的儿童，其生长潜力得到较好的发挥，生长发育状况较为理想。因而理想标准高于现状标准，高于一般儿童的发育水平。目前国际上常用的美国国家健康统计中心制定的国际标准或称世界卫生组织（WHO）标准即为理想标准。
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 87 -->
    <div class="page-box" page="95">
      <div v-if="showPageList.indexOf(95) > -1">      
      <div v-if="showPageList.indexOf(95) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">87</span>
        </div>
        <div class="padding-96">
@@ -668,11 +689,11 @@
            等级评价法常用的指标是身高和体重。个体儿童的身高、体重数值在标准均值±2个标准差范围内，均被视为正常，大约95%的儿童属于该范围。在标准均值±2个标准差以外
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 88 -->
    <div class="page-box" page="96">
      <div v-if="showPageList.indexOf(96) > -1">      
      <div v-if="showPageList.indexOf(96) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -713,15 +734,13 @@
            发育年龄又称为生物年龄或生理年龄。受遗传和环境的影响，儿童的生长发育存在个
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 89 -->
    <div class="page-box" page="97">
      <div v-if="showPageList.indexOf(97) > -1">      
      <div v-if="showPageList.indexOf(97) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">89</span>
        </div>
        <div class="padding-96">
@@ -773,11 +792,11 @@
            </div>
          </div>
        </div>
    </div>
      </div>
    </div>
    <!-- 90 -->
    <div class="page-box" page="98">
      <div v-if="showPageList.indexOf(98) > -1">      
      <div v-if="showPageList.indexOf(98) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -816,19 +835,19 @@
          <p>①头部。头颅大小、前囟大小及闭合情况，有无方颅及颅骨软化。</p>
          <p>②眼。眼睑形状、巩膜颜色、视力、眼距等是否正常。</p>
          <p>③耳。有无外耳畸形，耳道结构、听力等是否正常。</p>
          <p>④口腔。口腔颜色和形状、口腔黏膜、牙齿数目是否正常，是否有龋齿等。</p>
          <p>
            ④口腔。口腔颜色和形状、口腔黏膜、牙齿数目是否正常，是否有龋齿等。
          </p>
          <p>⑤胸部。胸廓有无畸形，听诊有无心脏杂音及肺内啰音。</p>
          <p>⑥腹部。腹部有无异常包块、肝脾有无异常肿大。</p>
        </div>
    </div>
      </div>
    </div>
    <!-- 91 -->
    <div class="page-box" page="99">
      <div v-if="showPageList.indexOf(99) > -1">      
      <div v-if="showPageList.indexOf(99) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">91</span>
        </div>
        <div class="padding-96">
@@ -849,7 +868,12 @@
          </h6>
          <p class="blockh6-c">
            <span class="img center dl-bl w100">专题四 学习主题一</span>
            <examinations v-if="questionData && questionData[99]" :cardList="questionData[99]" :chapter="4" :page="91" />
            <examinations
              v-if="questionData && questionData[99]"
              :cardList="questionData[99]"
              :chapter="4"
              :page="91"
            />
          </p>
          <h2 class="module_block" id="b017">
            <div class="custom1">学习主题二</div>
@@ -861,15 +885,28 @@
              >专题四学习主题二 学前儿童心理健康的评价自主学习任务单</span
            >
            <span class="t0 svg-btn" @click="changeResources('learnTableTwo')">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 19.28 20.563">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                width="16"
                height="17"
                viewBox="0 0 19.28 20.563"
              >
                <g transform="translate(-109.056 -82.941)">
                  <path class="a"
                  <path
                    class="a"
                    d="M3439.656-15185.7h-12.643a1.815,1.815,0,0,1-1.816-1.81v-16.944a1.83,1.83,0,0,1,1.816-1.809h15.674a1.8,1.8,0,0,1,1.79,1.809v13.93h-4.217a.6.6,0,0,0-.6.6v4.217h0Zm-9.819-2.764a.5.5,0,0,0-.5.5.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5.5.5,0,0,0-.5-.5Zm0-2a.5.5,0,0,0-.5.5.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5.5.5,0,0,0-.5-.5Zm1.393-8.525a2.416,2.416,0,0,0-2.416,2.411,2.421,2.421,0,0,0,2.416,2.42h.111a1.8,1.8,0,0,0,1.1,1.1,1.809,1.809,0,0,0,.6.107,1.808,1.808,0,0,0,1.7-1.206h4.072l-.172.172a.635.635,0,0,0-.179.454.569.569,0,0,0,.179.4.637.637,0,0,0,.435.176.6.6,0,0,0,.424-.176l1.2-1.214a.618.618,0,0,0,0-.858l-1.2-1.187a.619.619,0,0,0-.431-.176.6.6,0,0,0-.427.176.615.615,0,0,0,0,.854l.172.176h-4.072a1.8,1.8,0,0,0-1.1-1.1,1.755,1.755,0,0,0-.6-.1,1.808,1.808,0,0,0-1.7,1.206h-.111a.554.554,0,0,1-.145-.016,1.2,1.2,0,0,1-.84-.4,1.217,1.217,0,0,1-.3-.878,1.2,1.2,0,0,1,1.206-1.137.407.407,0,0,1,.069,0h3.729a1.807,1.807,0,0,0,1.118,1.114,1.816,1.816,0,0,0,.576.091,1.789,1.789,0,0,0,1.7-1.205h.309a2.415,2.415,0,0,0,1.679-.775,2.407,2.407,0,0,0,.637-1.729,2.411,2.411,0,0,0-2.419-2.324h-6.213a1.821,1.821,0,0,0-1.107-1.1,1.8,1.8,0,0,0-.6-.1,1.814,1.814,0,0,0-1.706,1.2,1.8,1.8,0,0,0,.077,1.389,1.787,1.787,0,0,0,1.026.92,1.841,1.841,0,0,0,.6.1,1.807,1.807,0,0,0,1.706-1.2h6.266a1.179,1.179,0,0,1,.836.4,1.22,1.22,0,0,1,.305.874,1.213,1.213,0,0,1-1.214,1.146h-.172a1.8,1.8,0,0,0-1.118-1.118,1.711,1.711,0,0,0-.576-.1,1.8,1.8,0,0,0-1.706,1.214Z"
                    transform="translate(-3316.14 15289.201)" />
                  <path class="a"
                    transform="translate(-3316.14 15289.201)"
                  />
                  <path
                    class="a"
                    d="M316.806,239.727a.6.6,0,1,0,.6-.6A.6.6,0,0,0,316.806,239.727Zm-5.421-4.207a.6.6,0,1,0,.6.6A.587.587,0,0,0,311.385,235.52Zm2.4,8.438a.607.607,0,1,0-.6-.613A.621.621,0,0,0,313.789,243.958Z"
                    transform="translate(-196.896 -148.921)" />
                  <path class="a" d="M763.392,793.79l3.262-3.262h-3.262Z" transform="translate(-638.661 -690.634)" />
                    transform="translate(-196.896 -148.921)"
                  />
                  <path
                    class="a"
                    d="M763.392,793.79l3.262-3.262h-3.262Z"
                    transform="translate(-638.661 -690.634)"
                  />
                </g>
              </svg>
            </span>
@@ -940,6 +977,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.学前儿童心理评估的特点是什么?</span>
                <textarea
@@ -949,6 +987,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.按照测验的目的划分，心理测验可以分为哪两大类?</span
@@ -960,6 +999,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.什么是筛查性测试?什么是诊断性测试?常见的筛查性测试和诊断性测试有哪些?</span
@@ -971,6 +1011,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.查资料，谈谈什么是绘人测试?如何开展?</span
@@ -982,6 +1023,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.查阅资料，韦克斯勒学前儿童智力量表包括哪些内容?如何开展?</span
@@ -993,6 +1035,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -1001,7 +1044,9 @@
            </tr>
            <tr>
              <td>
                <span class="ds-bl">针对自己在学习过程中的疑惑和问题提问。</span>
                <span class="ds-bl"
                  >针对自己在学习过程中的疑惑和问题提问。</span
                >
              </td>
            </tr>
          </table>
@@ -1017,6 +1062,7 @@
              placeholder="请输入内容"
              maxlength="200"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题主要讲述学前儿童心理评估的相关内容以及几种常见的评价学前儿童心理健康的方法，以指导幼教工作者更好地开展学前儿童心理保健工作。
@@ -1037,7 +1083,7 @@
    </div>
    <!-- 92 -->
    <div class="page-box" page="100">
      <div v-if="showPageList.indexOf(100) > -1">      
      <div v-if="showPageList.indexOf(100) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -1081,11 +1127,9 @@
    </div>
    <!-- 93 -->
    <div class="page-box" page="101">
      <div v-if="showPageList.indexOf(101) > -1">      
      <div v-if="showPageList.indexOf(101) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">93</span>
        </div>
        <div class="padding-96">
@@ -1127,11 +1171,11 @@
          <p>第八，用食指、拇指端捏小丸，捏时腕部离桌面，从上面捏。</p>
          <p>第九，临摹画圆，不可示范，不可说出名称。线的头尾连接成圆即可。</p>
        </div>
    </div>
      </div>
    </div>
    <!-- 94 -->
    <div class="page-box" page="102">
      <div v-if="showPageList.indexOf(102) > -1">      
      <div v-if="showPageList.indexOf(102) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -1184,15 +1228,13 @@
            第二十八，嘱儿童后退走，前脚跟与后脚尖的距离不超过2.5厘米。检查者可示范，要求儿童连续退4步。（3试2成功算通过。）
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 95 -->
    <div class="page-box" page="103">
      <div v-if="showPageList.indexOf(103) > -1">      
      <div v-if="showPageList.indexOf(103) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">95</span>
        </div>
        <div class="padding-96">
@@ -1264,7 +1306,7 @@
    </div>
    <!-- 96 -->
    <div class="page-box" page="104">
      <div v-if="showPageList.indexOf(104) > -1">      
      <div v-if="showPageList.indexOf(104) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -1313,15 +1355,13 @@
            贝利婴儿发育量表评估婴幼儿智力发育水平相对较全面、精确。每次测验时间45～60分钟，中国已有标准化的量表。
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 97 -->
    <div class="page-box" page="105">
      <div v-if="showPageList.indexOf(105) > -1">      
      <div v-if="showPageList.indexOf(105) > -1">
        <div class="page-header-box">
          <span class="page-header-text" 
            >专题四&nbsp;学前儿童健康评价</span
          >
          <span class="page-header-text">专题四&nbsp;学前儿童健康评价</span>
          <span class="page-header-num">97</span>
        </div>
        <div class="padding-96">
@@ -1351,7 +1391,12 @@
          </h6>
          <p class="blockh6-c center">
            <span class="img center dl-bl w100">专题四 学习主题二</span>
            <examinations v-if="questionData && questionData[105]" :cardList="questionData[105]" :chapter="4" :page="97" />
            <examinations
              v-if="questionData && questionData[105]"
              :cardList="questionData[105]"
              :chapter="4"
              :page="97"
            />
          </p>
          <h6 class="Conclusion-title4">专题小结</h6>
          <p class="blockh6">
@@ -1367,11 +1412,11 @@
            解亚宁、戴晓阳：《实用心理测验》，30～35页，北京，中国医药科技出版社，2006。
          </p>
        </div>
    </div>
      </div>
    </div>
    <!-- 98 -->
    <div class="page-box" page="106">
      <div v-if="showPageList.indexOf(106) > -1">      
      <div v-if="showPageList.indexOf(106) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -1387,6 +1432,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterFourData.question.short.qOne"
            @input="saveChapterOneData"
          ></textarea>
          <p>2.影响学前儿童生长发育的因素是什么？</p>
          <textarea
@@ -1394,6 +1440,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterFourData.question.short.qTwo"
            @input="saveChapterOneData"
          ></textarea>
          <p>3.评价学前儿童生长发育常用的方法有哪些？</p>
          <textarea
@@ -1401,6 +1448,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterFourData.question.short.qThree"
            @input="saveChapterOneData"
          ></textarea>
          <p>4.儿童健康检查应包括哪些项目？</p>
          <textarea
@@ -1408,6 +1456,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterFourData.question.short.qFour"
            @input="saveChapterOneData"
          ></textarea>
          <p>5.儿童心理评估的特点是什么？</p>
          <textarea
@@ -1415,6 +1464,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterFourData.question.short.qFive"
            @input="saveChapterOneData"
          ></textarea>
          <h6 class="Conclusion-title2">
            <img
@@ -1427,10 +1477,20 @@
          <p class="blockh6-c">
            学习完本专题，你的学习效果如何呢？咱们一起来扫码测一测吧！<br />
            <span class="img">过关检测（资格考试模拟题）1</span><br />
            <examinations v-if="questionData && questionData[106][1]" :cardList="questionData[106][1]" :chapter="4" :page="981" />
            <examinations
              v-if="questionData && questionData[106][1]"
              :cardList="questionData[106][1]"
              :chapter="4"
              :page="981"
            />
            <span class="span-border"></span>
            <span class="img mt-20 dl-bl">过关检测（资格考试模拟题）2</span>
            <examinations v-if="questionData && questionData[106][2]" :cardList="questionData[106][2]" :chapter="4" :page="982" />
            <examinations
              v-if="questionData && questionData[106][2]"
              :cardList="questionData[106][2]"
              :chapter="4"
              :page="982"
            />
          </p>
          <p class="custom_tag">•应用与探讨•</p>
          <p>1.测量幼儿的身高、体重、头围和胸围。</p>
@@ -1446,26 +1506,31 @@
              placeholder="请输入内容"
              maxlength="500"
              class="w100 ta-br textarea-text"
              @input="saveChapterOneData"
            ></textarea>
          </p>
        </div>
    </div>
      </div>
    </div>
  </div>
</template>

<script>
import examinations from "@/components/examinations/index.vue";
import {getResourcePath} from "@/assets/methods/resources";
import { getResourcePath } from "@/assets/methods/resources";
export default {
  components: {  examinations },
  props:{
    questionData:{
      type:Object
  components: { examinations },
  props: {
    questionData: {
      type: Object,
    },
    showPageList:{
      type:Array
    }
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -1477,7 +1542,6 @@
      pathFour: "",
      pathFive: "",
      pathSix: "",
      saveTime:20,
      chapterFourData: {
        experienceOne: "",
        experienceTwo: "",
@@ -1489,9 +1553,9 @@
          qFour: "",
          qFive: "",
          qSix: "",
          qSeven:"",
          qEnight:"",
          qNine:""
          qSeven: "",
          qEnight: "",
          qNine: "",
        },
        learnTableTwo: {
          qOne: "",
@@ -1505,32 +1569,22 @@
          short: {
            qOne: "",
            qTwo: "",
            qThree:"",
            qFour:"",
            qFive:"",
            qThree: "",
            qFour: "",
            qFive: "",
          },
        },
      },
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterFourData");
    if (localData) {
      this.chapterFourData = JSON.parse(localData);
    }
    window.timerFour = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
    if (!this.isSearch) {
      const localData = localStorage.getItem("chapterFourData");
      if (localData) {
        this.chapterFourData = JSON.parse(localData);
      }
    }, 1000);
    this.getVideoPath()
  },
  unmounted() {
    if (window.timerFour) {
      clearInterval(window.timerFour);
      this.getVideoPath();
    }
    localStorage.setItem("chapterFourData", JSON.stringify(this.chapterFourData));
  },
  methods: {
    changeResources(type) {
@@ -1541,17 +1595,26 @@
      }
    },
    async getVideoPath() {
      this.$data.pathOne = await getResourcePath("f2980359eb32cb3b74b284bf5348a596");
      this.$data.pathTwo = await getResourcePath("2677fc38748eeac767a4b3fab5989a38");
      this.$data.pathOne = await getResourcePath(
        "f2980359eb32cb3b74b284bf5348a596"
      );
      this.$data.pathTwo = await getResourcePath(
        "2677fc38748eeac767a4b3fab5989a38"
      );
      this.$data.pathThree = await getResourcePath(
        "87836d6f409df33817589b6b67514979"
      );
      this.$data.pathFour = await getResourcePath("24a624217470bdea16d22e3a25cc8aa5");
      this.$data.pathFive = await getResourcePath("df98433d6a6cbd5e768ec1bf721619e4");
      this.$data.pathSix = await getResourcePath("14916e143d49e15f94964ad0f8c372f1");
      this.$data.pathFour = await getResourcePath(
        "24a624217470bdea16d22e3a25cc8aa5"
      );
      this.$data.pathFive = await getResourcePath(
        "df98433d6a6cbd5e768ec1bf721619e4"
      );
      this.$data.pathSix = await getResourcePath(
        "14916e143d49e15f94964ad0f8c372f1"
      );
    },
    saveChapterOneData() {
      this.saveTime = 20;
      localStorage.setItem(
        "chapterFourData",
        JSON.stringify(this.chapterFourData)

 src/books/childHealth/view/content/components/chapter001.vue

@@ -60,7 +60,7 @@
      </div>
    </div>
    <!-- 2 -->
    <div class="page-box" page="10"  :show="showPageList.indexOf(10) > -1">
    <div class="page-box" page="10" :show="showPageList.indexOf(10) > -1">
      <div v-show="showPageList.indexOf(10) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
@@ -179,6 +179,7 @@
                    v-model="chapterOneData.learnTableOne.qOne"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >2.学前儿童的骨（骼）有什么特点？日常生活中应该如何保健？</span
@@ -189,6 +190,7 @@
                    v-model="chapterOneData.learnTableOne.qTwo"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >3.为什么学前儿童不宜从事拔河、攀岩、引体向上等活动？</span
@@ -199,6 +201,7 @@
                    v-model="chapterOneData.learnTableOne.qTHree"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >4.学前儿童骨骼肌有什么特点？运动过程中应该注意哪些事项？</span
@@ -209,6 +212,7 @@
                    v-model="chapterOneData.learnTableOne.qFour"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >5.幼儿园能组织幼儿练习写字吗？为什么？</span
@@ -219,6 +223,7 @@
                    v-model="chapterOneData.learnTableOne.qFive"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >6.学前儿童的关节有什么特点？日常生活中应该注意哪些问题？</span
@@ -229,6 +234,7 @@
                    v-model="chapterOneData.learnTableOne.qSix"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >7.什么是扁平足？怎样预防学前儿童形成扁平足？</span
@@ -239,6 +245,7 @@
                    v-model="chapterOneData.learnTableOne.qSeven"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >8.学前儿童运动系统的保育要点有哪些？</span
@@ -249,6 +256,7 @@
                    v-model="chapterOneData.learnTableOne.qEight"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >9.日常保教活动中，如何科学组织体育锻炼和户外活动？</span
@@ -259,6 +267,7 @@
                    v-model="chapterOneData.learnTableOne.qNine"
                    placeholder="请输入内容"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                </td>
              </tr>
@@ -375,6 +384,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br fm-st cl-66 fz-14"
                  @input="saveChapterOneData"
                ></textarea>
              </p>
              <p class="block">
@@ -389,7 +399,11 @@
              </p>
              <div class="text-img-box">
                <div style="margin-right: 50px" class="openImgBox">
                  <img src="../../../assets/images/chapterOne/0015-5.jpg" class="w100" alt="">
                  <img
                    src="../../../assets/images/chapterOne/0015-5.jpg"
                    class="w100"
                    alt=""
                  />
                  <span class="img">图1-1 人体全身骨骼（前面观）</span>
                </div>
                <div>
@@ -458,34 +472,25 @@
            </div>
            <div class="bottom-right" style="width: 35%">
              <div class="mt-40">
                <div class="banshi openImgBox" style="height: 364px;">
                <div class="banshi openImgBox" style="height: 364px">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                        <div class="imgBox" style="width: 100%; height: 100%">
                          <img
                            src="../../../assets/images/chapterOne/bones1.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                        <div class="imgBox" style="width: 100%; height: 100%">
                          <img
                            src="../../../assets/images/chapterOne/bones2.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                        <div class="imgBox" style="width: 100%; height: 100%">
                          <img
                            src="../../../assets/images/chapterOne/bones3.png"
                          />
@@ -528,7 +533,11 @@
              class="left fl fl-di fl-evenly openImgBox"
              style="width: 30%; margin-top: 5px"
            >
              <img src="../../../assets/images/chapterOne/0017-1.jpg" alt="" class="w100">
              <img
                src="../../../assets/images/chapterOne/0017-1.jpg"
                alt=""
                class="w100"
              />
              <p class="img">图1-3 关节模式图</p>
            </div>
            <div class="right" style="width: 70%; padding-left: 20px">
@@ -546,33 +555,29 @@
          <div class="fl">
            <div class="left" style="width: 30%">
              <div class="banshi openImgBox">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/foot-01.png" alt="正常足"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/foot-02.png" alt="扁平足"
                          />
                        </div>
                <div class="swiper-container swiper-img">
                  <div class="swiper-wrapper">
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img
                          src="../../../assets/images/chapterOne/foot-01.png"
                          alt="正常足"
                        />
                      </div>
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img
                          src="../../../assets/images/chapterOne/foot-02.png"
                          alt="扁平足"
                        />
                      </div>
                    </div>
                  </div>
                  <div class="swiper-button-next"></div>
                  <div class="swiper-button-prev"></div>
                </div>
              </div>
              <p class="img">图1-4 正常足和扁平足</p>
            </div>
            <div class="right" style="width: 70%; padding-left: 20px">
@@ -609,43 +614,34 @@
            </p>
            <div class="right fl fl-cn fl-di" style="width: 55%">
              <div class="banshi openImgBox">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-01.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-02.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-03.png"
                          />
                        </div>
                <div class="swiper-container swiper-img">
                  <div class="swiper-wrapper">
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img
                          src="../../../assets/images/chapterOne/posture-01.png"
                        />
                      </div>
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img
                          src="../../../assets/images/chapterOne/posture-02.png"
                        />
                      </div>
                    </div>
                    <div class="swiper-slide">
                      <div class="imgBox" style="width: 100%; height: 100%">
                        <img
                          src="../../../assets/images/chapterOne/posture-03.png"
                        />
                      </div>
                    </div>
                  </div>
                  <div class="swiper-button-next"></div>
                  <div class="swiper-button-prev"></div>
                </div>
              </div>
              <p class="img">图1-5 坐姿对脊柱的影响</p>
            </div>
          </div>
@@ -842,6 +838,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.学前儿童的鼻腔有什么特点?怎样进行科学保健?</span
@@ -853,6 +850,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.学前儿童的声带有什么特点?幼儿教师讲话为什么要轻声细语?</span
@@ -864,6 +862,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.学前儿童张口呼吸有哪些危害?怎样纠正?</span
@@ -875,6 +874,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">5.学前儿童的呼吸运动有什么特点?</span>
                <textarea
@@ -884,6 +884,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.学前儿童以什么模式的呼吸为主?</span>
                <textarea
@@ -893,6 +894,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">7.擤鼻涕的正确方法是什么?</span>
                <textarea
@@ -902,6 +904,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.针对学前儿童呼吸系统的特点，如何培养学前儿童良好的卫生习惯?</span
@@ -913,6 +916,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -957,6 +961,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              当家长及幼儿园教师发现孩子的鼻腔内有异物时，切勿紧张急躁，更不能严厉训斥和打骂孩子，以免孩子惊慌哭闹，将异物吸入下呼吸道，导致呼吸道异物的严重后果。同时，千万别用手、镊子等夹取鼻腔异物，这有可能致使异物越陷越深，难以取出，也很容易造成小孩鼻腔黏膜损伤，引起出血或发炎。而应设法劝阻孩子哭闹，改用口腔呼吸，然后迅速送往医院检查。本主题主要讲述学前儿童呼吸系统的生理特点及相关的保健知识，以便幼儿教师在教育教学活动中科学地对学前儿童的呼吸系统开展保健工作。
@@ -975,7 +980,11 @@
              <h5 id="e012">1.鼻</h5>
            </div>
            <div class="right openImgBox" style="width: 50%">
              <img src="../../../assets/images/chapterOne/0020-2.jpg" alt="" class="w100">
              <img
                src="../../../assets/images/chapterOne/0020-2.jpg"
                alt=""
                class="w100"
              />
              <p class="img">图1-6 呼吸系统示意图</p>
            </div>
          </div>
@@ -1046,7 +1055,11 @@
            </div>
            <div class="right" style="width: 20%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0021-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0021-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-7 喉腔模式图</p>
            </div>
@@ -1070,7 +1083,11 @@
          </p>
          <p class="img">表1-1 不同年龄的人的呼吸频率</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0021-2.jpg" alt="" class="w100">
            <img
              src="../../../assets/images/chapterOne/0021-2.jpg"
              alt=""
              class="w100"
            />
          </p>
        </div>
      </div>
@@ -1292,6 +1309,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.循环系统由哪几个部分组成?各自的结构和功能是什么?</span
@@ -1303,6 +1321,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.学前儿童的心脏有什么特点?日常保教活动中应如何保健?</span
@@ -1314,6 +1333,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.学前儿童的血管有什么特点?日常保教活动中应如何保健?</span
@@ -1325,6 +1345,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.学前儿童的淋巴系统有什么特点?日常保教活动中应如何保健?</span
@@ -1336,6 +1357,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.为什么要预防学前儿童缺铁性贫血?怎样预防?</span
@@ -1347,6 +1369,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.如何组织幼儿参加适合年龄特点的体育锻炼和户外活动才利于其血液循环的保健?</span
@@ -1358,6 +1381,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.学前儿童会患动脉粥样硬化吗?如何早期预防动脉样硬化?</span
@@ -1369,6 +1393,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -1395,6 +1420,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              要想了解这些问题，就必须了解学前儿童循环系统的特点。本主题主要讲述学前儿童循环系统的生理知识，阐明科学开展学前儿童循环系统保健的要点，以帮助幼儿教师在教育教学活动中科学开展学前儿童循环系统的保健工作。
@@ -1420,7 +1446,11 @@
            循环系统包括血液循环系统（心血管系统）和淋巴系统。血液循环系统由心脏和血管组成，血管包括动脉、静脉和毛细血管（见图1-8）。淋巴系统由淋巴管道、淋巴器官和淋巴组织组成。
          </p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0024-1.jpg" alt="" style="width:80%">
            <img
              src="../../../assets/images/chapterOne/0024-1.jpg"
              alt=""
              style="width: 80%"
            />
          </p>
          <p class="img">图1-8 血液循环示意图</p>

@@ -1456,7 +1486,11 @@
          <p>（1）血液量占体重的比例大于成人（见表1-2）</p>
          <p class="img">表1-2 不同年龄的血液量</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0024-3.jpg" alt="" class="w100" />
            <img
              src="../../../assets/images/chapterOne/0024-3.jpg"
              alt=""
              class="w100"
            />
          </p>
        </div>
      </div>
@@ -1507,7 +1541,11 @@
          </p>
          <p class="img">表1-3 不同年龄的心率</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0025-1.jpg" alt="" class="w100" />
            <img
              src="../../../assets/images/chapterOne/0025-1.jpg"
              alt=""
              class="w100"
            />
          </p>
        </div>
      </div>
@@ -1616,7 +1654,7 @@
            <span class="img center dl-bl w100">专题一 学习主题三</span>
            <examinations
              :cardList="questionData[22]"
              v-if="questionData  && questionData[22]"
              v-if="questionData && questionData[22]"
              :chapter="1"
              :page="14"
            />
@@ -1729,6 +1767,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.乳牙的结构特点是什么?除咀嚼食物外，乳牙还有哪些作用?</span
@@ -1740,6 +1779,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.乳牙一共有多少颗?什么时候全部出齐?</span
@@ -1751,6 +1791,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">4.什么叫龋齿?龋齿需要治疗吗?</span>
                <textarea
@@ -1760,6 +1801,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.为什么 3~6个月的婴儿容易发生“生理性流涎”?</span
@@ -1771,6 +1813,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.为什么新生儿容易溢奶?</span>
                <textarea
@@ -1780,6 +1823,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">7.学前儿童的肠道有什么特点?</span>
                <textarea
@@ -1789,6 +1833,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">8.日常生活中如何保护乳牙?</span>
                <textarea
@@ -1798,6 +1843,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >9.学前儿童消化系统的保健要点有哪些?</span
@@ -1809,6 +1855,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -1835,6 +1882,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              不断地为机体供应各种营养素是维持正常生理功能和促进生长发育的前提。而多种营养成分，尤其是产能营养素的结构比较复杂，摄入的食物不能直接为人体所用，必须通过消化系统将食物转变成结构简单的营养物质，才能供机体吸收、利用。学前儿童的消化系统发育尚不完善，需要成人根据其特点，合理喂养。本主题主要讲述学前儿童消化系统的生理知识，阐述对学前儿童消化系统进行保健的要点，以帮助幼儿教师在实际工作中科学开展学前儿童消化系统的保健工作。
@@ -1869,7 +1917,11 @@
            </div>
            <div class="right" style="width: 35%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0028-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0028-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-9 消化系统模式图</p>
            </div>
@@ -1929,11 +1981,19 @@
          <p>每一颗乳牙和恒牙的萌出都有固定的时间，见表1-4、表1-5。</p>
          <p class="img">表1-4 乳牙萌出时间顺序（以月龄计算）</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0029-1.jpg" alt="" class="w100" />
            <img
              src="../../../assets/images/chapterOne/0029-1.jpg"
              alt=""
              class="w100"
            />
          </p>
          <p class="img">表1-5 恒牙萌出时间</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0029-2.jpg" alt="" class="w100">
            <img
              src="../../../assets/images/chapterOne/0029-2.jpg"
              alt=""
              class="w100"
            />
          </p>
          <h5 id="e021">2.舌</h5>
          <p>
@@ -2079,7 +2139,7 @@
            <span class="img center dl-bl w100">专题一 学习主题四</span>
            <examinations
              :cardList="questionData[27]"
              v-if="questionData  && questionData[27]"
              v-if="questionData && questionData[27]"
              :chapter="1"
              :page="19"
            />
@@ -2223,6 +2283,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.学前儿童的肾脏有哪些特点?日常生活中应如何保健?</span
@@ -2234,6 +2295,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.学前儿童的膀胱有什么特点?这些特点导致哪些表现?</span
@@ -2245,6 +2307,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.为什么学前儿童容易出现遗尿现象?</span
@@ -2256,6 +2319,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.什么是上行性泌尿系统感染?应如何预防?</span
@@ -2267,6 +2331,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.学前儿童泌尿系统的日常保健要点有哪些?</span
@@ -2278,6 +2343,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -2304,6 +2370,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
          </div>
        </div>
@@ -2328,7 +2395,11 @@
          <div class="fl fl-around">
            <div class="left" style="width: 35%">
              <p class="center openImgBox" style="margin-top: 0">
                <img src="../../../assets/images/chapterOne/0033-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0033-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-10 泌尿系统模式图（男性）</p>
            </div>
@@ -2546,6 +2617,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.学前儿童生殖系统有什么特点?</span>
                <textarea
@@ -2555,6 +2627,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.学前儿童生殖系统的日常保健措施有哪些?</span
@@ -2566,6 +2639,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.学前儿童生殖器官的清洁卫生工作有哪些注意要点?</span
@@ -2577,6 +2651,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.为什么要重视学前儿童早期性教育?如何开展?</span
@@ -2588,6 +2663,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -2614,6 +2690,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              儿童通常在两三岁时会对性产生好奇，他们想了解许多有关性差别的问题，如果大人对他们采取隐瞒或回避的态度，儿童心中就会产生“性是不可以知道的”观念，并对性产生不正当的好奇心。本主题主要讲述学前儿童生殖系统的生理特点及相关的保健知识，以帮助幼儿教师在教育教学过程中正确开展学前儿童生殖系统的保健工作。
@@ -2641,13 +2718,21 @@
          <div class="fl">
            <div class="left" style="width: 50%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0036-1.png" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0036-1.png"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-11 男性生殖系统示意图</p>
            </div>
            <div class="right" style="width: 50%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0036-2.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0036-2.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-12 女性生殖系统示意图</p>
            </div>
@@ -2703,7 +2788,7 @@
            >
            <examinations
              :cardList="questionData[32]"
              v-if="questionData  && questionData[32]"
              v-if="questionData && questionData[32]"
              :chapter="1"
              :page="24"
            />
@@ -2829,6 +2914,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.内分泌系统的功能有哪些?</span>
                <textarea
@@ -2838,6 +2924,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.什么是呆小病?哪些因素会影响甲状腺素的生理功能?</span
@@ -2849,6 +2936,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.学前儿童的脑垂体有什么特点?为什么睡眠不足会影响身高的增长?</span
@@ -2860,6 +2948,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">5.什么是侏症?</span>
                <textarea
@@ -2869,6 +2958,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.学前儿童内分泌系统的保健要点有哪些?资源小贴士?</span
@@ -2880,6 +2970,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -2906,6 +2997,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              专家提醒，想要孩子长高，除了注意营养、运动、睡眠等外，还要注意某些疾病，尤其是内分泌系统疾病，它是影响孩子身高最常见的疾病因素。本主题主要讲述学前儿童内分泌系统的生理特点及相关的保健知识，以帮助幼儿教师科学安排幼儿的生活，保障学前儿童内分泌系统的正常发育和良好发展。
@@ -2966,7 +3058,11 @@
            </div>
            <div class="right" style="width: 50%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0038-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0038-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-13 内分泌系统示意图</p>
            </div>
@@ -2989,7 +3085,11 @@
            </div>
            <div class="right" style="width: 36%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0038-2.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0038-2.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-14 成年侏儒症患者与正常成人的身高比较</p>
            </div>
@@ -3041,7 +3141,7 @@
            <span class="img center dl-bl w100">专题一 学习主题七</span>
            <examinations
              :cardList="questionData[34]"
              v-if="questionData  && questionData[34]"
              v-if="questionData && questionData[34]"
              :chapter="1"
              :page="26"
            />
@@ -3157,6 +3257,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.什么是神经元?神经元由哪几部分组成?神经元的功能是什么?</span
@@ -3168,6 +3269,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">3.什么是脊髓?脊髓的功能是什么?</span>
                <textarea
@@ -3177,6 +3279,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">4.什么是反射?反射分为哪两类?</span>
                <textarea
@@ -3186,6 +3289,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.脑由哪几个部分结构?各部分的功能是什么?</span
@@ -3197,6 +3301,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.学前儿童神经系统的特点有哪些?</span>
                <textarea
@@ -3206,6 +3311,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.日常生活中，如何对学前儿童的神经系统进行保健?</span
@@ -3217,6 +3323,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -3243,6 +3350,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题讲述学前儿童神经系统的生理特点和相关的保教知识，以帮助幼儿教师在实际工作中科学组织教育活动，合理开发儿童的智力。
@@ -3277,7 +3385,11 @@
            </div>
            <div class="right" style="width: 50%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0040-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0040-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img cneter">图1-15 神经元模式图</p>
            </div>
@@ -3342,13 +3454,21 @@
            大脑分左、右两半球（见图1-16），表面凹凸不平，凹陷处称为“沟”，隆起处称为“回”，“沟”与“回”大大增加了大脑的表面积。较大的沟有中央沟、大脑外侧沟和顶枕沟，这些沟将大脑表面分成额叶、顶叶、颞叶和枕叶四部分。
          </p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0041-1.jpg" alt="" class="w100">
            <img
              src="../../../assets/images/chapterOne/0041-1.jpg"
              alt=""
              class="w100"
            />
          </p>
          <p class="img">图1-16 大脑左、右两半球的功能比较</p>
          <div class="fl fl-around">
            <div class="left" style="width: 48%; margin-right: 10px">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0041-2.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0041-2.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-17 大脑皮层分区图</p>
            </div>
@@ -3411,7 +3531,11 @@
          </p>
          <p class="img">表1-6 交感神经和副交感神经的作用与区别</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0042-1.jpg" alt="" class="w100">
            <img
              src="../../../assets/images/chapterOne/0042-1.jpg"
              alt=""
              class="w100"
            />
          </p>
          <h3 id="c016">二、学前儿童神经系统的特点＞＞＞＞＞＞</h3>
          <h4 id="d056">（一）脑发育非常迅速</h4>
@@ -3437,7 +3561,11 @@
          </p>
          <p class="img">表1-7 不同年龄脑质量的变化</p>
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0043-1.jpg" alt="" class="w100">
            <img
              src="../../../assets/images/chapterOne/0043-1.jpg"
              alt=""
              class="w100"
            />
          </p>
          <h4 id="d057">（二）中枢神经系统的发育不均衡</h4>
          <p>
@@ -3506,7 +3634,7 @@
            <span class="img center dl-bl w100">专题一 学习主题八</span>
            <examinations
              :cardList="questionData[39]"
              v-if="questionData  && questionData[39]"
              v-if="questionData && questionData[39]"
              :chapter="1"
              :page="31"
            />
@@ -3665,6 +3793,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.眼、耳、皮肤各自的组成结构是什么?它们各有什么功能?</span
@@ -3676,6 +3805,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.学前儿童的眼球有什么特点?如何进行眼的保健?</span
@@ -3687,6 +3817,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.什么叫生理性近视?如何预防和纠正?</span
@@ -3698,6 +3829,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.学前儿童的耳朵有什么特点?如何进行耳的保健?</span
@@ -3709,6 +3841,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.如何预防中耳炎?</span>
                <textarea
@@ -3718,6 +3851,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.学前儿童的皮肤有什么特点?如何进行皮肤保健?</span
@@ -3729,6 +3863,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.学前儿童的鼻、舌有什么特点?如何进行鼻、舌的保健?</span
@@ -3740,6 +3875,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -3766,6 +3902,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              相关调查发现，幼儿的视力问题已经成为越来越多的家长和幼儿的困扰，而且有年龄趋小的表现。幼儿视力的保护刻不容缓。本主题主要讲述学前儿童感觉器官的生理知识及保育保健要点，以帮助幼儿教师了解如何促进学前儿童感觉器官的正常发育和良好发展。
@@ -3828,7 +3965,11 @@
            </div>
            <div class="right" style="width: 35%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0046-2.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0046-2.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-18 眼球结构模式图</p>
            </div>
@@ -3937,7 +4078,11 @@
            </div>
            <div class="right" style="width: 58%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0048-1.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0048-1.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-19 耳的结构图</p>
            </div>
@@ -3960,7 +4105,11 @@
            </div>
            <div class="right" style="width: 48%">
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0048-2.jpg" alt="" class="w100">
                <img
                  src="../../../assets/images/chapterOne/0048-2.jpg"
                  alt=""
                  class="w100"
                />
              </p>
              <p class="img">图1-20 成人和学前儿童咽鼓管之比较</p>
            </div>
@@ -4273,7 +4422,7 @@
            <!-- <img class="img-g" alt="" src="image/0053-1.jpg" /><br /> -->
            <span class="img center dl-bl w100">专题一 学习主题九</span>
            <examinations
              :cardList="questionData[48] "
              :cardList="questionData[48]"
              v-if="questionData && questionData[48]"
              :chapter="1"
              :page="40"
@@ -4290,6 +4439,7 @@
              type="text"
              class="judge-input"
              v-model="chapterOneData.question.judge.qOne"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -4313,6 +4463,7 @@
              type="text"
              class="judge-input"
              v-model="chapterOneData.question.judge.qTwo"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -4320,6 +4471,8 @@
              type="text"
              class="judge-input"
              v-model="chapterOneData.question.judge.qThree"
              @input="saveChapterOneData"
              
            />）
          </p>
          <p class="block">
@@ -4327,6 +4480,7 @@
              type="text"
              class="judge-input"
              v-model="chapterOneData.question.judge.qFour"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block"><b>二、填空</b></p>
@@ -4335,10 +4489,12 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterOneData.question.fill.qOne.one"
              @input="saveChapterOneData"
            />的正常发育。幼儿过于肥胖，走路、站立时间过长，或负重过度，都可能导致足弓塌陷，引起<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterOneData.question.fill.qOne.two"
              @input="saveChapterOneData"
            />。
          </p>
          <p class="block">
@@ -4346,10 +4502,12 @@
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qTwo.one
              @input="saveChapterOneData"
            />的力量，促进胸廓和肺的正常发育，增加其<input
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qTwo.two
              @input="saveChapterOneData"
            />。
          </p>
          <p class="block">
@@ -4357,10 +4515,12 @@
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qThree.one
              @input="saveChapterOneData"
            />较差，所以，婴幼儿用药剂量要比成人小；学前儿童肝糖原储存较少，饥饿时易发生<input
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qThree.two
              @input="saveChapterOneData"
            />；学前儿童的胆汁分泌也较少，因此对差。
          </p>
          <p class="block">
@@ -4368,17 +4528,20 @@
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qThree.one
              @input="saveChapterOneData"
            />过程强于<input
              type="text"
              class="lineInput completion-input"
              chapterOneData.question.fill.qThree.two
              @input="saveChapterOneData"
            />过程。
          </p>
          <p class="block">
            5.为保护学前儿童的视力，要定期为学前儿童调换座位，以防<input
              type="text"
              class="lineInput completion-input"
            />或<input type="text" class="lineInput completion-input" />。
              @input="saveChapterOneData"
            />或<input type="text" class="lineInput completion-input" @input="saveChapterOneData" />。
          </p>
          <p class="block"><b>三、思考</b></p>
          <p class="block">
@@ -4389,6 +4552,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qOne"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">2.学前儿童声带有什么特点？怎样保护声带？</p>
          <textarea
@@ -4396,6 +4560,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qTwo"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">3.乳牙有哪些生理功能？如何保护乳牙？</p>
          <textarea
@@ -4403,6 +4568,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qThree"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">4.学前儿童皮肤有哪些特点？如何保护皮肤？</p>
          <textarea
@@ -4410,6 +4576,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qFour"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">5.学前儿童的眼睛有哪些生理特点？如何保护眼睛？</p>
          <textarea
@@ -4417,6 +4584,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qFive"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">6.学前儿童的耳有哪些生理特点？怎样保护耳？</p>
          <textarea
@@ -4424,6 +4592,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qSix"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">
            7.训练学前儿童嗅觉、味觉和触觉有哪些意义？如何训练？
@@ -4433,6 +4602,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterOneData.question.short.qSeven"
            @input="saveChapterOneData"
          ></textarea>
          <div>
            <p class="custom_tag">•应用与探讨•</p>
@@ -4509,6 +4679,7 @@
              placeholder="请输入内容"
              maxlength="800"
              class="w100 ta-br textarea-text"
              @input="saveChapterOneData"
            ></textarea>
          </p>
        </div>
@@ -4518,18 +4689,22 @@
</template>
<script>
import examinations from "@/components/examinations/index.vue";
import {getResourcePath} from "@/assets/methods/resources";
import { getResourcePath } from "@/assets/methods/resources";
export default {
  name: "chapter-one",
  components: { examinations },
  props: {
    showPageList: {
      type: Array,
      default: []
      default: [],
    },
    questionData: {
      type: Object
    }
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -4560,7 +4735,6 @@
      pathEight: "",
      pathNine: "",
      pathTen: "",
      saveTime: 20,
      chapterOneData: {
        experienceOne: "",
        experienceTwo: "",
@@ -4581,7 +4755,7 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableTwo: {
          qOne: "",
@@ -4592,7 +4766,7 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableThree: {
          qOne: "",
@@ -4603,7 +4777,7 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableFour: {
          qOne: "",
@@ -4614,7 +4788,7 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableFive: {
          qOne: "",
@@ -4625,14 +4799,14 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableSix: {
          qOne: "",
          qTwo: "",
          qThree: "",
          qFour: "",
          qFive: ""
          qFive: "",
        },
        learnTableSeven: {
          qOne: "",
@@ -4641,7 +4815,7 @@
          qFour: "",
          qFive: "",
          qSix: "",
          qSeven: ""
          qSeven: "",
        },
        learnTableEnight: {
          qOne: "",
@@ -4652,7 +4826,7 @@
          qSix: "",
          qSeven: "",
          qEight: "",
          qNine: ""
          qNine: "",
        },
        learnTableNine: {
          qOne: "",
@@ -4662,36 +4836,36 @@
          qFive: "",
          qSix: "",
          qSeven: "",
          qEight: ""
          qEight: "",
        },
        question: {
          judge: {
            qOne: "",
            qTwo: "",
            qThree: "",
            qFour: ""
            qFour: "",
          },
          fill: {
            qOne: {
              one: "",
              two: ""
              two: "",
            },
            qTwo: {
              oen: "",
              two: ""
              two: "",
            },
            qThree: {
              one: "",
              two: ""
              two: "",
            },
            qFour: {
              one: "",
              two: ""
              two: "",
            },
            qFive: {
              one: "",
              two: ""
            }
              two: "",
            },
          },
          short: {
            qOne: "",
@@ -4700,47 +4874,24 @@
            qFour: "",
            qFive: "",
            qSix: "",
            qSeven: ""
          }
        }
            qSeven: "",
          },
        },
      },
      swiper: null
      swiper: null,
    };
  },
  async mounted() {
    this.getVideoPath();
    const localData = localStorage.getItem("chapterOneData");
    if (localData) {
      this.chapterOneData = JSON.parse(localData);
    }
    window.timerOne = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
      }
    }, 1000);
    // this.$data.questionData = await getQuestionData(
    //   "1",
    //   testData[1],
    //   this.config.activeBook
    // );
  },
  unmounted() {
    if (window.timerOne) {
      clearInterval(window.timerOne);
    }
    localStorage.setItem("chapterOneData", JSON.stringify(this.chapterOneData));
  },
  watch: {
    showPageList: {
      handler(newVal, oldVal) {
        console.log(newVal, "章节接收内容");
    if (!this.isSearch) {
      this.getVideoPath();
      const localData = localStorage.getItem("chapterOneData");
      if (localData) {
        this.chapterOneData = JSON.parse(localData);
      }
    }
  },
  methods: {
    changeResources(type) {
      console.log("点击", this.$props.questionData);
      if (type == "learnTbaleOne") {
        this.$data.learnTbaleOne = !this.$data.learnTbaleOne;
      } else if (type == "videoOne") {
@@ -4766,33 +4917,44 @@
      }
    },
    async getVideoPath() {
      console.log('pathOne',await getResourcePath("f6f6588a75086576b87bed2fb9ca1ec1"))
      this.$data.pathOne = await getResourcePath("f6f6588a75086576b87bed2fb9ca1ec1");
      this.$data.pathTwo = await getResourcePath("e5993b62684fe55d13190cfe52bf00ed");
      this.$data.pathOne = await getResourcePath(
        "f6f6588a75086576b87bed2fb9ca1ec1"
      );
      this.$data.pathTwo = await getResourcePath(
        "e5993b62684fe55d13190cfe52bf00ed"
      );
      this.$data.pathThree = getResourcePath(
        "6b6d42213aa85aa5ff7724aaf96ffee6"
      );
      this.$data.pathFour = await getResourcePath("17fb1555f98c8fceabce5ff75077af58");
      this.$data.pathFive = await getResourcePath("163c06871b763954952d1cd74373c618");
      this.$data.pathSix = await getResourcePath("1d57d897974b22f7f3191f4073ea0641");
      this.$data.pathSeven = await  getResourcePath(
      this.$data.pathFour = await getResourcePath(
        "17fb1555f98c8fceabce5ff75077af58"
      );
      this.$data.pathFive = await getResourcePath(
        "163c06871b763954952d1cd74373c618"
      );
      this.$data.pathSix = await getResourcePath(
        "1d57d897974b22f7f3191f4073ea0641"
      );
      this.$data.pathSeven = await getResourcePath(
        "e67262b8e73ca5b05374b903defd874f"
      );
      this.$data.pathEight = await getResourcePath(
        "6731ebf8ea78297eedcb56521726481d"
      );
      this.$data.pathNine = await getResourcePath("5ef5496040abee4013a5f61e3c5b42b9");
      this.$data.pathTen = await getResourcePath("4afe59338bb841a498593cbe458c7d7d");
      this.$data.pathNine = await getResourcePath(
        "5ef5496040abee4013a5f61e3c5b42b9"
      );
      this.$data.pathTen = await getResourcePath(
        "4afe59338bb841a498593cbe458c7d7d"
      );
    },
    saveChapterOneData() {
      // 记录第一张输入数据
      this.saveTime = 20;
      localStorage.setItem(
        "chapterOneData",
        JSON.stringify(this.chapterOneData)
      );
    },
  }
  },
};
</script>


 src/books/childHealth/view/content/components/chapter002.vue

@@ -148,6 +148,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.实际工作中一般将学前儿童的生长发育划分为哪几个阶段?</span
@@ -159,6 +160,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">3.“十月怀胎”是整十个月吗?</span>
                <textarea
@@ -168,6 +170,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">4.胎儿期的特点有哪些?</span>
                <textarea
@@ -177,6 +180,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">5.新生儿期有哪些特点??</span>
                <textarea
@@ -186,6 +190,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.婴儿期包括新生儿期吗?</span>
                <textarea
@@ -195,6 +200,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.婴儿什么时候断奶合适，有没有明确规定?</span
@@ -206,6 +212,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">8.幼儿前期的主要特点有哪些?</span>
                <textarea
@@ -215,6 +222,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">9.如何做好幼小衔接中的保健工作?</span>
                <textarea
@@ -224,6 +232,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -250,6 +259,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题主要讲述生长、发育和成熟的概念，阐述学前儿童各年龄段的划分及各阶段生长发育的特点，以帮助保教人员根据学前儿童生长发育的特点科学地开展保教工作。
@@ -466,6 +476,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.学前儿童生长发展的规律有哪些?</span>
                <textarea
@@ -475,6 +486,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.什么是生长发育的连续性?什么是生长发育的阶段性?</span
@@ -486,6 +498,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">4.什么是生长发育的程序性?</span>
                <textarea
@@ -495,6 +508,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.人体器官或者系统有哪些生长发育模式?</span
@@ -506,6 +520,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">6.什么是生长发育的不均衡性?</span>
                <textarea
@@ -515,6 +530,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">7.什么叫追赶性生长?</span>
                <textarea
@@ -524,6 +540,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">8.你听说过关键生长期吗?</span>
                <textarea
@@ -533,6 +550,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >9.在婴幼儿的生长发育过程中，动作发展的一般顺序是怎样的?</span
@@ -544,6 +562,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >10.哪些系统的生长发育模式属于-一般型"?</span
@@ -555,6 +574,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >11.为什么说学前儿童各系统的生长发育是相互关联的?</span
@@ -566,6 +586,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -590,6 +611,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              人体的生长发育同其他事物一样，也有自身的客观规律。这个规律是正常人体在一定生活条件下生长发育的必然趋势和本质联系。研究学前儿童正常的生长发育规律，才可能发现异常、寻找原因，以便纠正或治疗，并设法促进其正常的生长和发育。本主题主要讲述学前儿童生长发育的规律，以帮助幼教工作者正确判断和分析指导学前儿童的生长发育保健工作。
@@ -892,6 +914,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >2.同卵双胞胎在生长发育过程中保持相同的因素有哪些?</span
@@ -903,6 +926,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >3.环境因素影响生长发育的进程，主要包括哪些因素?</span
@@ -914,6 +938,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >4.适当的体育锻炼会对生长发育产生哪些影响?</span
@@ -925,6 +950,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10">5.季节对儿童生长发育有哪些影响?</span>
                  <textarea
@@ -934,6 +960,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >6.为什么同卵双胞胎也存在很多不同特征?</span
@@ -945,6 +972,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                  <span class="ds-bl mt-10"
                    >7.除了教材提到的因素，还有哪些后天因素可能会影响儿童的生长发育?</span
@@ -956,6 +984,7 @@
                    placeholder="请输入内容"
                    maxlength="300"
                    class="w100 ta-br textarea-text"
                    @input="saveChapterOneData"
                  ></textarea>
                </td>
              </tr>
@@ -1023,6 +1052,7 @@
              placeholder="请输入内容"
              maxlength="300"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              学前儿童的生长发育过程是个体在先天遗传和后天环境中各种因素相互作用的结果。影响生长发育的因素很多，概括起来有两类：内在的遗传因素和外在的环境因素。遗传因素一般是不会改变的，而环境条件是可以改变的。遗传因素决定了生长发育的潜力，而环境和教育条件影响了遗传潜力的发挥，最后决定发育的速度及达到的程度。
@@ -1171,6 +1201,7 @@
              type="text"
              class="judge-input"
              v-model="chapterTwoData.question.judge.qOne"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1178,6 +1209,7 @@
              type="text"
              class="judge-input"
              v-model="chapterTwoData.question.judge.qTwo"
              @input="saveChapterOneData"
            />）
          </p>
        </div>
@@ -1199,6 +1231,7 @@
              type="text"
              class="judge-input"
              v-model="chapterTwoData.question.judge.qThree"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1206,6 +1239,7 @@
              type="text"
              class="judge-input"
              v-model="chapterTwoData.question.judge.qFour"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block"><b>二、填空</b></p>
@@ -1214,6 +1248,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qOne.one"
              @input="saveChapterOneData"
            />的规律。
          </p>
          <p class="block">
@@ -1221,10 +1256,12 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qTwo.one"
              @input="saveChapterOneData"
            />上升，而是<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qTwo.Two"
              @input="saveChapterOneData"
            />上升。
          </p>
          <p class="block">
@@ -1232,18 +1269,22 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qThree.one"
              @input="saveChapterOneData"
            />性，环境决定了学前儿童生长发育的<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qThree.Two"
              @input="saveChapterOneData"
            />性。学前儿童的生长发育就是个体的<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qThree.Three"
              @input="saveChapterOneData"
            />因素与<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qThree.Four"
              @input="saveChapterOneData"
            />因素相互作用的过程。
          </p>
          <p class="block">
@@ -1251,6 +1292,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qFour.one"
              @input="saveChapterOneData"
            />基础。
          </p>
          <p class="block">
@@ -1258,10 +1300,12 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qFive.one"
              @input="saveChapterOneData"
            />因素的影响；农村幼儿和城市幼儿生长发育状况不同，这体现了<input
              type="text"
              class="lineInput completion-input"
              v-model="chapterTwoData.question.fill.qFive.Two"
              @input="saveChapterOneData"
            />因素对学前儿童生长发育的影响。
          </p>
          <p class="block"><b>三、思考</b></p>
@@ -1271,6 +1315,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterTwoData.question.short.qOne"
            @input="saveChapterOneData"
          ></textarea>
          <p class="block">2.影响学前儿童生长发育的因素有哪些？</p>
          <textarea
@@ -1278,6 +1323,7 @@
            :rows="8"
            placeholder="请输入内容"
            v-model="chapterTwoData.question.short.qTwo"
            @input="saveChapterOneData"
          ></textarea>
          <div>
            <p class="custom_tag">•应用与探讨•</p>
@@ -1316,6 +1362,7 @@
              placeholder="请输入内容"
              maxlength="800"
              class="w100 ta-br textarea-text"
              @input="saveChapterOneData"
            ></textarea>
          </p>
        </div>
@@ -1336,6 +1383,10 @@
    },
    showPageList:{
      type:Array
    },
    isSearch:{
      type:Boolean,
      default:false
    }
  },
  data() {
@@ -1348,7 +1399,6 @@
      pathOne: "",
      pathTwo: "",
      pathThree: "",
      saveTime: 20,
      chapterTwoData: {
        experienceOne: "",
        experienceTwo: "",
@@ -1426,23 +1476,13 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterTwoData");
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterTwoData");
    if (localData) {
      this.chapterTwoData = JSON.parse(localData);
    }
    window.timerTwo = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
      }
    }, 1000);
    this.getVideoPath();
  },
  unmounted() {
    if (window.timerTwo) {
      clearInterval(window.timerTwo);
    }
    localStorage.setItem("chapterTwoData", JSON.stringify(this.chapterTwoData));
  },
  methods: {
    changeResources(type) {
@@ -1465,8 +1505,6 @@
      );
    },
    saveChapterOneData() {
      this.saveTime = 20;
      console.log(this.chapterTwoData);
      localStorage.setItem(
        "chapterTwoData",
        JSON.stringify(this.chapterTwoData)

 src/books/childHealth/view/content/components/chapter003.vue

@@ -155,6 +155,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.为什么发现儿童有动作迟缓和异常现象要及时排查原因?</span
@@ -166,6 +167,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.3岁前儿童在认识世界的过程中，哪些感觉起着重要作用?3岁后有什么变化?</span
@@ -177,6 +179,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.唐诗“少小离家老大回，乡音未改鬓毛衰"说明了儿童语言发展哪个方面的特征?</span
@@ -188,6 +191,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.只要幼儿在幼儿园不哭、不闹，就说明他情绪没问题?</span
@@ -199,6 +203,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.儿童个性的发展会受到哪些因素的发展?为什么说良好的心理环境是保证儿童健全人格的重要前提?</span
@@ -210,6 +215,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.影响学前儿童心理发展的因素有哪些?</span
@@ -221,6 +227,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.遗传因素对儿童心理发展的作用主要表现在哪些方面?</span
@@ -232,6 +239,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >9.什么是儿童发展的关键期?它与哪个影响因素相关?</span
@@ -243,6 +251,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >10.社会生活条件和教育对儿童的发展起哪些作用?</span
@@ -254,6 +263,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >11.怎样看待儿童自身的主观能动性在其发展中的作用?</span
@@ -265,6 +275,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">12.学前儿童心理健康的标志是什么?</span>
                <textarea
@@ -274,6 +285,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -300,6 +312,7 @@
              placeholder="请输入内容"
              maxlength="600"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              心理学研究表明，这些现象是由儿童心理发展的特点和规律造成的。本主题主要讲述学前儿童心理发展的特点及影响因素，为年轻的父母及学前教育机构的老师开展科学的早期教育提供依据。
@@ -770,6 +783,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >2.为何把学前儿童的心理问题称为行为问题?</span
@@ -781,6 +795,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.导致学前儿童出现心理行为问题的原因有哪些?压力是属于其中的哪个原因?</span
@@ -792,6 +807,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >4.引起学前儿童产生压力的原因有哪些?</span
@@ -803,6 +819,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.儿童常见的心理行为问题通常有哪些?</span
@@ -814,6 +831,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.对于啃咬指甲的年幼孩子，怎样引导效果更好?对于啃咬指甲严重的儿童，可采用什么矫治的方法?</span
@@ -825,6 +843,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.导致儿童出现过度依赖的原因主要有哪些?其高发年是几岁?</span
@@ -836,6 +855,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.“学前儿童的偷窃是品德恶劣的行为，一定要把其消灭在萌芽状态。"这个观点对吗?为什么?</span
@@ -847,6 +867,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -863,6 +884,7 @@
              placeholder="请输入内容"
              maxlength="400"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题主要讲述学前儿童产生压力的原因、学前儿童常见的心理行为问题及其引导的相关知识，以期为家长及幼儿教育机构的老师正确对待学前儿童的心理行为问题提供帮助。
@@ -1322,6 +1344,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">2.儿童期常见的心理疾病有哪些?</span>
                <textarea
@@ -1331,6 +1354,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >3.判断婴儿有无发育障碍的依据有哪些?为什么要提倡早发现、早诊断、早治疗?</span
@@ -1342,6 +1366,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">4.诊断主要解决哪些问题?</span>
                <textarea
@@ -1351,6 +1376,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >5.什么是言语?什么是语言?两者是什么关系?</span
@@ -1362,6 +1388,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >6.什么是言语和语言障碍?什么是沟通障碍?两者又是什么关系?</span
@@ -1373,6 +1400,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >7.2岁的孩子还不开口说话，奶奶说:“贵人语迟’，没关系。”对此，你怎么看?</span
@@ -1384,6 +1412,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >8.什么是精神发育迟滞?它的发生率是多少?</span
@@ -1395,6 +1424,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10">9.什么是孤独症?它有哪些临床表现?</span>
                <textarea
@@ -1404,6 +1434,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >10.孤独症的发生率是多少?怎样进行治疗?</span
@@ -1415,6 +1446,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >11.什么是儿童多动症?它的核心症状有哪些?临床表现有哪些?</span
@@ -1426,6 +1458,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >12.区别多动症与非多动症的重要指标是什么?</span
@@ -1437,6 +1470,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
                <span class="ds-bl mt-10"
                  >13.儿童多动症的发生率是多少?怎样进行治疗?</span
@@ -1448,6 +1482,7 @@
                  placeholder="请输入内容"
                  maxlength="300"
                  class="w100 ta-br textarea-text"
                  @input="saveChapterOneData"
                ></textarea>
              </td>
            </tr>
@@ -1493,6 +1528,7 @@
              placeholder="请输入内容"
              maxlength="200"
              class="w100 ta-br fm-st cl-66 fz-14"
              @input="saveChapterOneData"
            ></textarea>
            <p class="block">
              本主题主要讲述学前儿童常见的由遗传因素、身体因素和心理社会因素引起的心理疾病方面的知识，希望能为家长和集体教育机构的老师提供一些诊断和保育方面的信息，以便为有特殊需要的儿童提供更好的服务。
@@ -1760,6 +1796,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qOne"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1767,6 +1804,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qTwo"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1774,6 +1812,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qThree"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1781,6 +1820,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qFour"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1788,6 +1828,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qFive"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block">
@@ -1795,6 +1836,7 @@
              type="text"
              class="judge-input"
              v-model="chapterThreeData.question.judge.qSix"
              @input="saveChapterOneData"
            />）
          </p>
          <p class="block"><b>二、填空</b></p>
@@ -1803,6 +1845,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qOne.one"
              @input="saveChapterOneData"
            />。
          </p>
          <p class="block">
@@ -1810,6 +1853,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qTwo.one"
              @input="saveChapterOneData"
            />，最后到达脚部。
          </p>
          <p class="block">
@@ -1817,6 +1861,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qThree.one"
              @input="saveChapterOneData"
            />岁时发音机制已开始定型，以后再发别的音，就容易有口音。
          </p>
          <p class="block">
@@ -1824,6 +1869,7 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFour.one"
              @input="saveChapterOneData"
            />。
          </p>
          <p class="block">
@@ -1831,31 +1877,37 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFive.one"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFive.two"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFive.three"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFive.four"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qThree.five"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qFive.six"
              @input="saveChapterOneData"
            />等。
          </p>
        </div>
@@ -1877,21 +1929,25 @@
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qSix.one"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qSix.two"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qSix.three"
              @input="saveChapterOneData"
            />、
            <input
              type="text"
              class="lineInput completion-input"
              v-model="chapterThreeData.question.fill.qSix.four"
              @input="saveChapterOneData"
            />。
          </p>
          <p class="custom_tag">•应用与探讨•</p>
@@ -1930,6 +1986,7 @@
              placeholder="请输入内容"
              maxlength="800"
              class="w100 ta-br textarea-text"
              @input="saveChapterOneData"
            ></textarea>
          </p>
        </div>
@@ -1950,6 +2007,10 @@
    },
    showPageList:{
      type:Array
    },
    isSearch:{
      type:Boolean,
      default:false
    }
  },
  data() {
@@ -1965,7 +2026,6 @@
      pathFour: "",
      pathFive: "",
      pathSix: "",
      saveTime: 20,
      chapterThreeData: {
        experienceOne: "",
        experienceTwo: "",
@@ -2056,23 +2116,14 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterThreeData");
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterThreeData");
    if (localData) {
      this.chapterThreeData = JSON.parse(localData);
    }
    window.timerThree = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
      }
    }, 1000);
    this.getVideoPath()
  },
  unmounted() {
    if (window.timerThree) {
      clearInterval(window.timerThree);
    }
    localStorage.setItem("chapterThreeData", JSON.stringify(this.chapterThreeData));

  },
  methods: {
    changeResources(type) {
@@ -2097,7 +2148,6 @@
      this.$data.pathSix = await getResourcePath("bc3af85cd899b20adf885c308c595fbb");
    },
    saveChapterOneData() {
      this.saveTime = 20;
      localStorage.setItem(
        "chapterThreeData",
        JSON.stringify(this.chapterThreeData)

 src/books/childHealth/view/content/components/chapter005.vue

@@ -2734,6 +2734,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -2837,22 +2841,7 @@
    if (localData) {
      this.chapterFiveData = JSON.parse(localData);
    }
    window.timerFive = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
      }
    }, 1000);
    this.getVideoPath();
  },
  unmounted() {
    if (window.timerFive) {
      clearInterval(window.timerFive);
    }
    localStorage.setItem(
      "chapterFiveData",
      JSON.stringify(this.chapterFiveData)
    );
  },
  methods: {
    changeResources(type) {
@@ -2869,7 +2858,6 @@
      }
    },
    saveChapterOneData() {
      this.saveTime = 20;
      localStorage.setItem(
        "chapterFiveData",
        JSON.stringify(this.chapterFiveData)

 src/books/childHealth/view/content/components/chapter006.vue

@@ -2731,6 +2731,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -2850,17 +2854,19 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterSixData");
    if (localData) {
      this.chapterSixData = JSON.parse(localData);
    }
    window.timerSix = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterSixData");
      if (localData) {
        this.chapterSixData = JSON.parse(localData);
      }
    }, 1000);
    this.getVideoPath();
      window.timerSix = setInterval(() => {
        this.saveTime--;
        if (this.saveTime == 0) {
          this.saveChapterOneData();
        }
      }, 1000);
      this.getVideoPath();
    }
  },
  unmounted() {
    if (window.timerSix) {

 src/books/childHealth/view/content/components/chapter007.vue

@@ -3616,6 +3616,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -3745,7 +3749,8 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterSevenData");
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterSevenData");
    if (localData) {
      this.chapterSevenData = JSON.parse(localData);
    }
@@ -3756,6 +3761,7 @@
      }
    }, 1000);
    this.getVideoPath()
    }
  },
  unmounted() {
    if (window.timerSeven) {

 src/books/childHealth/view/content/components/chapter008.vue

@@ -2406,6 +2406,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -2510,17 +2514,19 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterEnightData");
    if (localData) {
      this.chapterEnightData = JSON.parse(localData);
    }
    window.timerEnight = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterEnightData");
      if (localData) {
        this.chapterEnightData = JSON.parse(localData);
      }
    }, 1000);
    this.getVideoPath();
      window.timerEnight = setInterval(() => {
        this.saveTime--;
        if (this.saveTime == 0) {
          this.saveChapterOneData();
        }
      }, 1000);
      this.getVideoPath();
    }
  },
  unmounted() {
    if (window.timerEnight) {

 src/books/childHealth/view/content/components/chapter009.vue

@@ -1746,6 +1746,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -1830,17 +1834,19 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterNineData");
    if (localData) {
      this.chapterNineData = JSON.parse(localData);
    }
    window.timerNine = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterNineData");
      if (localData) {
        this.chapterNineData = JSON.parse(localData);
      }
    }, 1000);
    this.getVideoPath();
      window.timerNine = setInterval(() => {
        this.saveTime--;
        if (this.saveTime == 0) {
          this.saveChapterOneData();
        }
      }, 1000);
      this.getVideoPath();
    }
  },
  unmounted() {
    if (window.timerNine) {

 src/books/childHealth/view/content/components/chapter010.vue

@@ -1364,6 +1364,10 @@
    showPageList: {
      type: Array,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -1426,17 +1430,19 @@
    };
  },
  async mounted() {
    const localData = localStorage.getItem("chapterTenData");
    if (localData) {
      this.chapterTenData = JSON.parse(localData);
    }
    window.timerTen = setInterval(() => {
      this.saveTime--;
      if (this.saveTime == 0) {
        this.saveChapterOneData();
    if(!this.isSearch) {
      const localData = localStorage.getItem("chapterTenData");
      if (localData) {
        this.chapterTenData = JSON.parse(localData);
      }
    }, 1000);
    this.getVideoPath();
      window.timerTen = setInterval(() => {
        this.saveTime--;
        if (this.saveTime == 0) {
          this.saveChapterOneData();
        }
      }, 1000);
      this.getVideoPath();
    }
  },
  unmounted() {
    if (window.timerTen) {

 src/books/childHealth/view/content/components/header.vue

@@ -193,10 +193,8 @@
</template>

<script>
import evenHeaderVue from "../../components/pageHeader/evenHeader.vue";
export default {
  name: "page-header",
  components: { evenHeaderVue },
  props: {
    showPageList: {
      type: Array,
@@ -215,7 +213,7 @@
  object-fit: contain;
}
.box {
  width: 400px;
  max-width: 400px;
  margin: 0 auto;
}
.line {

 src/books/childHealth/view/content/index.vue

@@ -21,51 +21,61 @@
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterOne>
      <chapterTwo
        v-if="showCatalogList.indexOf(3) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterTwo>
      <chapterThree
        v-if="showCatalogList.indexOf(4) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterThree>
      <chapterFour
        v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterFour>
      <chapterFive
        v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterFive>
      <chapterSix
        v-if="showCatalogList.indexOf(7) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterSix>
      <chapterSeven
        v-if="showCatalogList.indexOf(8) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterSeven>
      <chapterEight
        v-if="showCatalogList.indexOf(9) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterEight>
      <chapterNine
        v-if="showCatalogList.indexOf(10) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterNine>
      <chapterTen
        v-if="showCatalogList.indexOf(11) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        :isSearch="isSearch"
      ></chapterTen>
      <chapterEleven
        v-if="showCatalogList.indexOf(12) > -1"
@@ -122,7 +132,8 @@
      loadPageList: [],
      questionDataMap: {},
      renderSignMap: {},
      highlightData: null
      highlightData: null,
      isSearch:false
    };
  },
  computed: {
@@ -619,11 +630,14 @@
                  } else {
                    const obj = {};
                    for (let key in testData[catalog][page]) {
                      obj[key] = await getQuestionList(
                        [],
                        testData[catalog][page][key],
                        this.config.activeBook
                      );
                      const token = localStorage.getItem('jsek-token')
                      if(token) {
                          obj[key] = await getQuestionList(
                          [],
                          testData[catalog][page][key],
                          this.config.activeBook
                        );
                      }
                    }
                    this.questionDataMap[page] = obj;
                  }

 src/books/embedded/view/components/chapter001.vue

@@ -51,10 +51,12 @@
            随着后PC时代的到来，在制造业领域更注重使用符合其特定需求并带有智能的嵌入式工业控制组态软件，而嵌入式组态软件特具的按功能剪裁的特性，以及其内嵌的实时多任务操作系统，可保证整个嵌入系统体积小、成本低、实时性高、可靠性高的同时，还方便不具备嵌入式软件开发经验的用户在极短的时间内，使用嵌入式组态软件快速开发完成一个嵌入式系统，并极大地加快了嵌入式产品进入市场的速度，而且使产品具有丰富的人机界面。北京昆仑通态公司MCGS组态软件，通过大力加强对工控硬件产品的驱动支持和提升软件内部功
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">1</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">1</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 2 -->
@@ -293,10 +295,12 @@
            （2）设备窗口是MCGS嵌入版系统与外围设备联系的媒介。设备窗口专门用来放置不同
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">3</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">3</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 4 -->
@@ -457,10 +461,12 @@
            （5）TPC7062K启动。使用24V直流电源给TPC供电，开机启动后屏幕出现“正在启动”提示进度条，此时不需任何操作自动进入工程运行界面，如图1-11所示。
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">5</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">5</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 6 -->
@@ -741,10 +747,12 @@
            在安装程序窗口中单击“安装组态软件”按钮，弹出安装程序窗口。单击“下一步”按钮，启动安装程序，如图1-16所示。
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">7</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">7</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 8 -->
@@ -1116,10 +1124,12 @@
            （2）单击“窗口属性”按钮，弹出“用户窗口属性设置”对话框，在“基本属性”选项卡，将“窗口名称”修改为“常用构件使用”，单击“确认”按钮进行保存，如图1-23所示。
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">9</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">9</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 10 -->
@@ -1274,10 +1284,12 @@
            （6）单击工具箱中的“输入框”按钮，在窗口按住鼠标左键，拖放出两个一定大小的“输入框”，分别摆放在“状态显示1：”标签、“状态显示2：”标签的旁边位置，如图1-32所示。
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">11</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">11</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 12 -->
@@ -1485,10 +1497,12 @@
            />按钮，进行下载配置。单击“联机运行”按钮，连接方式选择“TCP/IP网络通信”，设置触摸屏IP与计算机IP在同一网段内，单击“通信测试”按钮，通
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">13</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">13</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 14 -->
@@ -1881,10 +1895,12 @@
            ></textarea>
          </p>
        </div>
        <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
          <li class="footer-num">15</li>
          <li class="footer-box"></li>
        </ul>
        <div class="fl ju-ed">
          <ul class="page-footer fl fl-cl al-cn w-mi p0 mb-40">
            <li class="footer-num">15</li>
            <li class="footer-box"></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

 src/books/embedded/view/components/index.vue

@@ -1,5 +1,8 @@
<template>
  <div class="page-main" @scroll="throttledScrollHandler">
    <div id="searchDomBox" style="display: none">
      <div id="searchContent"></div>
    </div>
    <div
      class="page-content"
      :style="{
@@ -40,8 +43,9 @@
      observer: null,
      loadPageObserver: null,
      loadPageList: [],
      questionData: {},
      renderSignMap: {}
      questionDataMap: {},
      renderSignMap: {},
      highlightData: null,
    };
  },
  computed: {
@@ -50,7 +54,7 @@
    },
    pageZoom() {
      return this.$store.state.qiankun.scale / 100;
    }
    },
  },
  watch: {
    showCatalogList: {
@@ -61,7 +65,7 @@
        ) {
          // 调用父层方法
          this.$store.state.qiankun.catalogChange({
            showCatalogList: newVal
            showCatalogList: newVal,
          });
        }
        // 启动页码观察
@@ -69,17 +73,24 @@
          this.initObservation();
          this.initThemeColor();
        }, 500);
      }
      },
    },
    loadPageList: {
      handler(newVal, oldVal) {
        console.log(newVal, "this.loadPageList");
        setTimeout(() => {
          this.initSwiper();
          this.initViewer();
        }, 200);
      }
    }
      },
    },
    pageZoom: {
      handler(newVal, oldVal) {
        const scrollBox = (
          this.container ? this.container : document
        ).querySelector(".page-main");
        scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal;
      },
    },
  },
  mounted() {
    // 默认加载章节
@@ -106,7 +117,15 @@
        // 删除笔记、高亮、划线
        delSign: (data) => {
          this.delSign(data);
        }
        },
        // 全文检索
        searchBookByKeyword: (keyword) => {
          return this.searchTextByPage(keyword);
        },
        // 跳转检索结果位置
        jumpSearchItem: (data) => {
          this.searchItemLocation(data);
        },
      });
    }

@@ -115,13 +134,13 @@
    this.observer = new IntersectionObserver(this.pageChangeCallback, {
      root: null, // 指定根元素，这里设为 null，表示选取整个视窗作为根元素。
      rootMargin: "0px", // 指定根元素的边界，这里设为 "0px"，表示根元素的边界和视窗的边界重合
      threshold: 0.5 // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。
      threshold: 0.5, // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。
    });

    this.loadPageObserver = new IntersectionObserver(this.loadPageCallback, {
      root: null, // 指定根元素，这里设为 null，表示选取整个视窗作为根元素。
      rootMargin: "0px", // 指定根元素的边界，这里设为 "0px"，表示根元素的边界和视窗的边界重合
      threshold: 0 // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。
      threshold: 0, // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。
    });

    // 启动页码观察
@@ -147,9 +166,36 @@
    //   });
    // }, 2000);
    //   }, 5000);
    // }, 1000);

    // const pageDom = (this.container ? this.container : document)
    //   .querySelector("#app")
    //   .querySelectorAll(".page-box");
    // 检索
    // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage");
    // 检索跳转
    // this.searchItemLocation({
    //   catalog: 2,
    //   page: 10,
    //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼（见图1-1）。骨骼是人体的支架，具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下，肌肉收缩牵动所附着的骨绕着关节转动，使身体产生各种动作。所以，运动系统具有运动、支持和保护等功能，幼年时期的骨骼还具有造血功能。 ",
    //   txtIndex: 57
    // });
    // }, 5000);
  },
  methods: {
    // setZoom1() {
    //   let scale = this.$store.state.qiankun.scale + 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // setZoom2() {
    //   let scale = this.$store.state.qiankun.scale - 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // 滚动监听
    scrollFun(event) {
      // 判断向上滚动还是向下滚动
@@ -205,7 +251,7 @@
          this.showCatalogList = [
            this.catalogLength - 2,
            this.catalogLength - 1,
            this.catalogLength
            this.catalogLength,
          ];
        } else {
          this.showCatalogList = [catalog - 1, catalog, catalog + 1];
@@ -232,6 +278,7 @@
        // 立即渲染
        this.renderSign(type, data);
      }

      // 储存数据
      if (!this.renderSignMap[type]) this.renderSignMap[type] = {};
      if (!this.renderSignMap[type][data.page])
@@ -241,6 +288,10 @@

    // 渲染标记
    renderSign(type, data) {
      // 父层设置禁止渲染标记时不再进行渲染
      if (this.$store.state.qiankun.disableSign) {
        return false;
      }
      const existence = (
        this.container ? this.container : document
      ).querySelector(`[dataid="${data.id}"]`);
@@ -250,10 +301,7 @@
          this.container ? this.container : document
        ).querySelector(`[page="${data.page}"]`);
        // 创建 createTreeWalker 迭代器，用于遍历文本节点，保存到一个数组
        const treeWalker = document.createTreeWalker(
          pageDom,
          NodeFilter.SHOW_TEXT
        );
        const treeWalker = document.createTreeWalker(pageDom, NodeFilter.SHOW_TEXT);
        const allTextNodes = [];
        let currentNode = treeWalker.nextNode();
        while (currentNode) {
@@ -429,6 +477,7 @@
      });
    },
    getParentWithClass(element, className) {
      console.log(element, className, "element, className");
      while (element.parentElement) {
        element = element.parentElement;
        if (element.classList.contains(className)) {
@@ -458,7 +507,7 @@
            this.$store.state.qiankun.pageChange({
              page: page,
              catalog: catalog,
              text
              text,
            });
          // const sections = Array.from(document.querySelectorAll(".section"));
          //sections：获取所有具有 .section 类名的元素，并转换为数组。
@@ -478,16 +527,15 @@
              "chapter"
            );
            const catalog = catalogDom.getAttribute("num");
            // if (!this.questionData[page]) {
            // if (!this.questionDataMap[page]) {
            //   if (testData && testData[catalog]) {
            //     if (testData[catalog][page]) {
            //       if (Array.isArray(testData[catalog][page])) {
            //         this.questionData[page] = await getQuestionList(
            //         this.questionDataMap[page] = await getQuestionList(
            //           page,
            //           testData[catalog][page],
            //           this.config.activeBook
            //         );
                    
            //       } else {
            //         const obj = {};
            //         for (let key in testData[catalog][page]) {
@@ -497,9 +545,9 @@
            //             this.config.activeBook
            //           );
            //         }
            //         this.questionData[page] = obj;
            //         this.questionDataMap[page] = obj;
            //       }
            //       console.log('题目',this.questionData);
            //       console.log("题目", this.questionDataMap);
            //     }
            //   }
            // }
@@ -512,6 +560,36 @@
                  this.renderSign(key, item);
                });
              }
            }
            // 处理高亮
            if (this.highlightData) {
              // 高亮行
              setTimeout(() => {
                // 获取页面所有text节点
                const pageTextList = document.createTreeWalker(target, NodeFilter.SHOW_TEXT);
                // 匹配关键字
                const allPageTextNodes = [];
                let currentNode = pageTextList.nextNode();
                while (currentNode) {
                  allPageTextNodes.push(currentNode);
                  currentNode = pageTextList.nextNode();
                }
                for (let i = 0; i < allPageTextNodes.length; i++) {
                  const textDom = allPageTextNodes[i];
                  let txtIndex = textDom.textContent.indexOf(
                    this.highlightData.txt
                  );
                  if (txtIndex > -1) {
                    textDom.parentNode.style.transition =
                      "background-color 0.8s";
                    textDom.parentNode.scrollIntoView();
                    textDom.parentNode.style.backgroundColor = "#79bbf0";
                    setTimeout(() => {
                      textDom.parentNode.style.backgroundColor = "";
                    }, 1000);
                  }
                }
              }, 100);
            }
            if (this.loadPageList.length > 5) {
              // 超过5页
@@ -564,40 +642,40 @@
      for (let i = 0; i < pptDoms.length; i++) {
        const dom = pptDoms[i];
        new Swiper(dom, {
        loop: false, // 无缝
        autoplay: false,
        paginationClickable: true,
        slidesPerView: 1, // 一组三个
        spaceBetween: 30, // 间隔
        // 如果需要前进后退按钮
        navigation: {
          nextEl: (this.container ? this.container : document).querySelector(
            ".swiper-button-next"
          ),
          prevEl: (this.container ? this.container : document).querySelector(
            ".swiper-button-prev"
          ),
        },
        // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
        observer: true,
        observeParents: true,
        on: {
          init:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
          loop: false, // 无缝
          autoplay: false,
          paginationClickable: true,
          slidesPerView: 1, // 一组三个
          spaceBetween: 30, // 间隔
          // 如果需要前进后退按钮
          navigation: {
            nextEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-next"
            ),
            prevEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-prev"
            ),
          },
          slideChange:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
          // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
          observer: true,
          observeParents: true,
          on: {
            init: (value) => {
              let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
              let totalPages = value.slides.length; // 获取总页数
              var paginationInfoEl = dom.querySelector(".pageBox");
              if (paginationInfoEl)
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            },
            slideChange: (value) => {
              let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
              let totalPages = value.slides.length; // 获取总页数
              var paginationInfoEl = dom.querySelector(".pageBox");
              if (paginationInfoEl)
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            },
          },
        },
      });
        });
      }
    },
    initViewer() {
@@ -607,18 +685,124 @@
      for (let i = 0; i < doms.length; i++) {
        const dom = doms[i];
        new Viewer(dom, {
          container: (this.container ? this.container.querySelector("#app") : "body"),
          container: this.container
            ? this.container.querySelector("#app")
            : "body",
          navbar: true, // 显示导航栏
          toolbar: true, // 显示工具栏
          title: true // 显示标题
          title: true, // 显示标题
        });
      }
    }
    },
    // 根据关键字全文检索
    searchTextByPage(keyword) {
      const searchResult = [];
      let catalogIndex = 0;
      // 所有章节组件（每本书制作时单独配置）
      const pageData = {
        pageHeader,
        chapterOne,
      };
      // 遍历所有章节文件
      for (const key in pageData) {
        catalogIndex++;
        let pageComponent, pageExample;
        // 先渲染一次当前章节文件（这时页面的内容为空），获取页码信息
        pageComponent = Vue.extend(pageData[key]);
        pageExample = new pageComponent({
          propsData: {
            showPageList: [],
            questionData: {},
          },
        });
        pageExample.$mount(
          (this.container ? this.container : document).querySelector(
            "#searchContent"
          )
        );
        // 获取页码
        const pageDom = (this.container ? this.container : document)
          .querySelector("#searchDomBox")
          .querySelectorAll(".page-box");
        const pages = [];
        for (let i = 0; i < pageDom.length; i++) {
          const pageDomItem = pageDom[i];
          pages.push(Number(pageDomItem.getAttribute("page")));
        }
        // 获取页面结束，卸载销毁
        pageExample.$destroy();
        (this.container ? this.container : document).querySelector(
          "#searchDomBox"
        ).innerHTML = '<div id="searchContent"></div>';
        // 遍历页码
        if (pages.length) {
          for (let i = 0; i < pages.length; i++) {
            const pageNum = pages[i];
            // 动态渲染对应章节的页码
            pageComponent = Vue.extend(pageData[key]);
            pageExample = new pageComponent({
              propsData: {
                showPageList: [pageNum],
                questionData: {},
              },
            });
            pageExample.$mount(
              (this.container ? this.container : document).querySelector(
                "#searchContent"
              )
            );
            // 获取对应页面dom
            const thisPageDom = (this.container ? this.container : document)
              .querySelector("#searchDomBox")
              .querySelector(`[page="${pageNum}"]`);
            if (thisPageDom) {
              // 获取页面所有text节点
              const pageTextList = document.createTreeWalker(thisPageDom, NodeFilter.SHOW_TEXT);
              // 匹配关键字
              const allPageTextNodes = [];
              let currentNode = pageTextList.nextNode();
              while (currentNode) {
                allPageTextNodes.push(currentNode);
                currentNode = pageTextList.nextNode();
              }
              for (let i = 0; i < allPageTextNodes.length; i++) {
                const textDom = allPageTextNodes[i];
                let txtIndex = textDom.textContent.indexOf(keyword);
                if (txtIndex > -1) {
                  // 记录关键字所在页码、章节以及匹配到的段落
                  searchResult.push({
                    page: pageNum,
                    catalog: catalogIndex,
                    txt: textDom.textContent,
                    txtIndex: txtIndex,
                  });
                }
              }
              // 结束，卸载销毁
              pageExample.$destroy();
              (this.container ? this.container : document).querySelector(
                "#searchDomBox"
              ).innerHTML = '<div id="searchContent"></div>';
            }
          }
        }
      }
      // 输出搜索结果
      console.log(searchResult);
      return searchResult;
    },
    // 根据检索结果跳转对应位置并高亮
    searchItemLocation(data) {
      // 记录高亮信息
      this.highlightData = data;
      // 跳转
      this.gotoPage(data.catalog, data.page, () => {});
    },
  },
  components: {
    pageHeader,
    chapterOne,
  }
  },
};
</script>
<style scoped lang="less">

 src/books/lifeCare/css/default.less

@@ -44,6 +44,21 @@
    top: 4%;
  }

  .zt-yy-brd {
    padding: 5px 15px;
    border: 3px dotted #f49a4c;
    border-radius: 10px;
  }

  .chapter-006 {
    position: relative;

    .btn {
      position: absolute;
      top: 65%;
      left: 35%;
    }
  }

  .border-xxfs {
    border-radius: 0 !important;
@@ -290,11 +305,11 @@
            margin-top: -12%;

            .title {
              font-size: 18px;
              font-size: 16px;
            }

            .pageStr {
              font-size: 18px;
              font-size: 16px;
            }
          }
        }
@@ -364,10 +379,10 @@

        @media (max-width: 756px) {
          .second-con {
            font-size: 18px;
            font-size: 16px;

            .pageNum {
              font-size: 18px !important;
              font-size: 16px !important;
            }
          }
        }
@@ -434,10 +449,14 @@

      tr td {
        border: 1px solid #999;
        text-align: center;
        text-align: left;
        padding: 8px;
        overflow: hidden;
        white-space: pre-line;
        font-family: 'FZLTXIHJW';
        font-weight: normal;
        font-size: 14px;
        line-height: 23px;

        input {
          font-size: 14px;
@@ -578,7 +597,7 @@
        cursor: pointer;
        margin-left: 10px;
      }
      

      .upload_text {
        color: #000;
        font-size: 14px;
@@ -676,6 +695,7 @@
      }

      .p-text {
        padding: 5px 10px;
        p {

          line-height: 22px;
@@ -986,7 +1006,7 @@

    .tip-specail {
      border: 1px solid #f49a4c !important;
      padding: 15px 15px;
      padding: 10px 15px;
    }

    p {
@@ -1554,6 +1574,120 @@
      top: -2em;
    }
  }

  @media screen and (max-width:800px) {
    .public-lifeCare .coverImg {
      position: absolute;
      top: 25%;
      left: 0;
    }

    .chapter {

      .prefaceImg {
        width: 100% !important;
        position: absolute;
        left: 0%;
        top: 4%;
      }

      .pdf-content {
        padding: 20% 5%;
        box-sizing: border-box;
      }

      div.bk-tx {
        textarea {
          min-width: 275px;
        }
      }

      p {
        margin-top: 0;
        line-height: 25px;
        font-size: 16px;
        font-family: 'FZLTXIHJW'
      }

      .header .pageHeader-second .second-con .second-right img {
        height: 30px;
        position: absolute;
        left: -35px;
        top: 0;
      }

      div.bj1 {
        padding: 0.01em 1em 0.01em 1em;
        margin-top: -2em;
        margin-left: -4em;
        margin-right: -1em;
      }

      .img-gn {
        height: 40px;
        margin-bottom: -0.4em;
      }

      h3 {
        font-family: "FZLTZHJW";
        font-weight: bold;
        font-size: 16px;
        margin-top: 2em;
        /* margin-bottom: 2em; */
        text-indent: 0em;
      }

      h4 {
        text-align: left;
        font-family: "FZLTZHJW";
        font-weight: bold;
        color: #f49a4c;
        font-size: 16px;
        margin-top: 0.2em;
        margin-bottom: 2em;
        text-indent: 0em;

        .fontsz1 {
          width: auto;
        }

      }

      .bj-tip {
        top: -25px;
        left: 10px;
        font-size: 16px;
        font-weight: normal;
        font-family: 'FZLTZHJW';

        div {
          width: 30px;
          height: 27px;
        }
      }

      p.bj1-qjms {
        top: -1em;
      }

      .table111,
      .table112 {
        width: 100%;
        border-collapse: collapse;

        tr th {
          width: auto !important;
        }
      }


      .drawContent_wall {
        margin-bottom: 2em;
      }

      
    }
  }
}

body {

 src/books/lifeCare/image/ydsc.jpg

 src/books/lifeCare/index.vue

@@ -12,37 +12,44 @@
      <front001
        v-if="showCatalogList.indexOf(1) > -1"
        :showPageList="loadPageList"
        :isSearch="isSearch"
      />
      <ChapterOne
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <ChapterTwo
        v-if="showCatalogList.indexOf(3) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <ChapterThree
        v-if="showCatalogList.indexOf(4) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <ChapterFour
        v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <ChapterFive
        v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        @Upload_initViewer="changeDomViewer"
        :isSearch="isSearch"
      />
      <chapterSix
        v-if="showCatalogList.indexOf(7) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <chapterSeven
        v-if="showCatalogList.indexOf(8) > -1"
@@ -50,16 +57,19 @@
        :questionData="questionData"
        @eventSwdt="swdtChange"
        @Upload_initViewer="changeDomViewer"
        :isSearch="isSearch"
      />
      <chapterEight
        v-if="showCatalogList.indexOf(9) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <chapterNine
        v-if="showCatalogList.indexOf(10) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <chapter010
        v-if="showCatalogList.indexOf(11) > -1"
@@ -143,6 +153,7 @@
      loadPageList: [],
      questionData: {},
      renderSignMap: {},
      isSearch: false,
    };
  },
  computed: {
@@ -253,9 +264,9 @@
    // }, 1000);
  },
  methods: {
    changeDomViewer(){
    changeDomViewer() {
      setTimeout(() => {
        this.initViewer()
        this.initViewer();
      }, 500);
    },
    // 滚动监听
@@ -633,7 +644,7 @@
          autoplay: {
            //自动开始
            delay: 3000, //时间间隔
            disableOnInteraction: false //*手动操作轮播图后不会暂停*
            disableOnInteraction: false, //*手动操作轮播图后不会暂停*
          },
          paginationClickable: true,
          slidesPerView: 1, // 一组三个
@@ -645,11 +656,11 @@
            ),
            prevEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-prev"
            )
            ),
          },
          // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
          observer: true,
          observeParents: true
          observeParents: true,
          // // 如果需要分页器
          // pagination: {
          //   el: (this.container ? this.container : document).querySelector(
@@ -677,7 +688,7 @@
            ),
            prevEl: (this.container ? this.container : document).querySelector(
              ".swiper-button-prev"
            )
            ),
          },
          // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
          observer: true,
@@ -696,8 +707,8 @@
              var paginationInfoEl = dom.querySelector(".pageBox");
              if (paginationInfoEl)
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            }
          }
            },
          },
        });
      }
    },
@@ -713,7 +724,7 @@
            : "body",
          navbar: true, // 显示导航栏
          toolbar: true, // 显示工具栏
          title: true // 显示标题
          title: true, // 显示标题
        });
      }
    },

 src/books/lifeCare/view/chapter001.vue

@@ -1005,7 +1005,7 @@
                  <td>
                    <input
                      v-model="chapter001.table112.cell58"
                      @blur="onBlurChangeTable112('cell58')"
                      @blur="onBlurChangeTable112('cell581')"
                    />
                  </td>
                  <td>
@@ -1403,7 +1403,7 @@
</template>

<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";

export default {
@@ -1415,6 +1415,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -1440,13 +1444,15 @@
    examinations,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter001"));
    if (localData) {
      this.chapter001 = { ...Object.assign(this.chapter001, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter001"));
      if (localData) {
        this.chapter001 = { ...Object.assign(this.chapter001, localData) };
      }
      this.chapter001.videOneUrl = await getResourcePath(
        "68ebd5c05bcb742999a9ebdce4b4bd53"
      );
    }
    this.chapter001.videOneUrl = await getResourcePath(
      "68ebd5c05bcb742999a9ebdce4b4bd53"
    );
  },
  methods: {
    activityOne() {

 src/books/lifeCare/view/chapter002.vue

@@ -288,10 +288,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter002.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter002.groupHeader"
                      :key="index"
@@ -427,7 +424,8 @@
                    :style="{
                      width:
                        index == 0 ||
                        index == chapter002.tableData121.length - 1
                        index == chapter002.headersData.length - 2 ||
                        index == chapter002.headersData.length - 1
                          ? '100px'
                          : '',
                    }"
@@ -707,11 +705,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter002.inspectData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter002.inspectHeader"
                      :key="index"
@@ -991,11 +985,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter002.designData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter002.designHeader"
                      :key="index"
@@ -1410,7 +1400,7 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";

export default {
@@ -1422,6 +1412,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -1452,7 +1446,6 @@
          "自查人签名",
        ], // 表头
        tableData121: [
          // 二维数组作为表格数据
          ["空调", "", "", "", "", "", "", ""],
          ["电视机", "", "", "", "", "", "", ""],
          ["电风扇", "", "", "", "", "", "", ""],
@@ -1460,6 +1453,8 @@
          ["电灯", "", "", "", "", "", "", ""],
          ["电脑", "", "", "", "", "", "", ""],
          ["门窗", "", "", "", "", "", "", ""],
          ["水管", "", "", "", "", "", "", ""],
          ["其他设备", "", "", "", "", "", "", ""],
        ],
        tableData122: [
          ["", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],
@@ -1663,20 +1658,18 @@
    examinations,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter002"));
    if (localData) {
      this.chapter002 = { ...Object.assign(this.chapter002, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter002"));
      if (localData) {
        this.chapter002 = { ...Object.assign(this.chapter002, localData) };
      }
      this.chapter002.videOneUrl = await getResourcePath(
        "6e471afdbeb95a8891f1551cbb0cd4fd"
      );
      this.chapter002.videOneUrl116 = await getResourcePath(
        "b727b78f8036a38cbd054816a81da7f8"
      );
    }
    this.chapter002.videOneUrl = await getResourcePath(
      "6e471afdbeb95a8891f1551cbb0cd4fd"
    );
    this.chapter002.videOneUrl116 = await getResourcePath(
      "b727b78f8036a38cbd054816a81da7f8"
    );
    // this.chapter002.videOneUrl116 =
    //   "https:/jsek.bnuic.com/file/api/ApiDownload?md5=b727b78f8036a38cbd054816a81da7f8";
    // this.chapter002.videOneUrl =
    //   "https:/jsek.bnuic.com/file/api/ApiDownload?md5=6e471afdbeb95a8891f1551cbb0cd4fd";
  },
  methods: {
    activityOne() {
@@ -1705,6 +1698,11 @@
      this.$set(this.chapter002.tableData121[rowIndex], cellIndex, value);
      localStorage.setItem("chapter002", JSON.stringify(this.chapter002));
    },
    updateCell122(rowIndex, cellIndex, value) {
      // 更新单元格数据
      this.$set(this.chapter002.tableData122[rowIndex], cellIndex, value);
      localStorage.setItem("chapter002", JSON.stringify(this.chapter002));
    },
    updateCell123(rowIndex, cellIndex, value) {
      // 更新单元格数据
      this.$set(this.chapter002.tableData123[rowIndex], cellIndex, value);

 src/books/lifeCare/view/chapter003.vue

@@ -292,10 +292,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter003.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -311,6 +308,19 @@
                  >
                    <td v-for="(cell, cellIndex) in row" :key="cellIndex">
                      <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.groupData[rowIndex][cellIndex]"
                          @blur="
                            updateCellGroup(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.groupData[rowIndex][cellIndex]"
@@ -928,11 +938,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter003.scoreData1.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -960,9 +966,38 @@
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.scoreData1[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore1(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template>
                      <!-- <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData1[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore1(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template> -->
                    </td>
                  </tr>
                </tbody>
@@ -1254,11 +1289,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter003.scoreData2.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -1273,7 +1304,36 @@
                    :key="rowIndex"
                  >
                    <td v-for="(cell, cellIndex) in row" :key="cellIndex">
                      <!-- <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData2[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore2(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template> -->
                      <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData2[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore2(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.scoreData2[rowIndex][cellIndex]"
@@ -1585,11 +1645,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter003.scoreData3.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -1617,9 +1673,38 @@
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.scoreData3[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore3(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template>
                      <!-- <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData3[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore3(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template> -->
                    </td>
                  </tr>
                </tbody>
@@ -1800,11 +1885,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter003.scoreData4.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -1832,9 +1913,38 @@
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.scoreData4[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore4(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template>
                      <!-- <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData4[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore4(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template> -->
                    </td>
                  </tr>
                </tbody>
@@ -2082,11 +2192,11 @@
          <p>婴幼儿练习刷牙的注意事项是什么？</p>
          <div class="bk-tx">
            <textarea
              v-model="chapter003.textAreaItem.text33"
              v-model="chapter003.textAreaItem.text331"
              style="border: 0"
              placeholder="请输入内容"
              rows="5"
              @blur="onBlurChange('text33')"
              @blur="onBlurChange('text331')"
            ></textarea>
          </div>
        </div>
@@ -2147,11 +2257,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter003.scoreData5.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter003.publicHeader"
                      :key="index"
@@ -2166,7 +2272,36 @@
                    :key="rowIndex"
                  >
                    <td v-for="(cell, cellIndex) in row" :key="cellIndex">
                      <!-- <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData5[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore5(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else>
                        {{ cell }}
                      </template> -->
                      <template v-if="cell === ''">
                        <input
                          type="text"
                          v-model="chapter003.scoreData5[rowIndex][cellIndex]"
                          @blur="
                            updateCellScore5(
                              rowIndex,
                              cellIndex,
                              $event.target.value
                            )
                          "
                        />
                      </template>
                      <template v-else-if="cellIndex == 4">
                        <input
                          type="text"
                          v-model="chapter003.scoreData5[rowIndex][cellIndex]"
@@ -2785,7 +2920,7 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
// import getQuestionData from "@/assets/methods/examination.js";
// import testData from "../js/examinationList.js";
import examinations from "@/components/examinations/index.vue";
@@ -2800,6 +2935,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -3247,70 +3386,45 @@
    drawflow,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter003"));
    if (localData) {
      this.chapter003 = { ...Object.assign(this.chapter003, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter003"));
      if (localData) {
        this.chapter003 = { ...Object.assign(this.chapter003, localData) };
      }
      this.chapter003.videOneUrl = await getResourcePath(
        "459ab85d46207bfcca4801dc9b319b9b"
      );
      this.chapter003.videoTwoUrl = await getResourcePath(
        "3817bea302b25b865ff938140939a8de"
      );
      this.chapter003.videoFourUrl = await getResourcePath(
        "7af72da649f6656c3b2164e708f5c132"
      );
      this.chapter003.videoFiveUrl = await getResourcePath(
        "e24de9b0cdd889cb73e9b472ad6f4731"
      );
      this.chapter003.videoSixUrl = await getResourcePath(
        "d95740ab777d9c7ca074c33317a835c4"
      );
      this.chapter003.videoSevenUrl = await getResourcePath(
        "0b330926f3e6ed510b48144a83199fb3"
      );
      this.chapter003.videoEigthUrl = await getResourcePath(
        "9f63cc4dcba6a87cbfe82a9ec4d7c77e"
      );
      this.chapter003.videoNineUrl = await getResourcePath(
        "c2ecf6f102a6e9b210f3db49b17b58a4"
      );
      this.chapter003.videoTenUrl = await getResourcePath(
        "b6943018923c0cbad4e414dc2097cb9a"
      );
      this.chapter003.videoEleUrl = await getResourcePath(
        "eb604885f7c01cdf2d95df839c9c233a"
      );
      this.chapter003.videoTevUrl = await getResourcePath(
        "f12a50c2ac57da78ff02f3d5f430163b"
      );
    }
    this.chapter003.videOneUrl = await getResourcePath(
      "459ab85d46207bfcca4801dc9b319b9b"
    );
    this.chapter003.videoTwoUrl = await getResourcePath(
      "3817bea302b25b865ff938140939a8de"
    );
    this.chapter003.videoFourUrl = await getResourcePath(
      "7af72da649f6656c3b2164e708f5c132"
    );
    this.chapter003.videoFiveUrl = await getResourcePath(
      "e24de9b0cdd889cb73e9b472ad6f4731"
    );
    this.chapter003.videoSixUrl = await getResourcePath(
      "d95740ab777d9c7ca074c33317a835c4"
    );
    this.chapter003.videoSevenUrl = await getResourcePath(
      "0b330926f3e6ed510b48144a83199fb3"
    );
    this.chapter003.videoEigthUrl = await getResourcePath(
      "9f63cc4dcba6a87cbfe82a9ec4d7c77e"
    );
    this.chapter003.videoNineUrl = await getResourcePath(
      "c2ecf6f102a6e9b210f3db49b17b58a4"
    );
    this.chapter003.videoTenUrl = await getResourcePath(
      "b6943018923c0cbad4e414dc2097cb9a"
    );
    this.chapter003.videoEleUrl = await getResourcePath(
      "eb604885f7c01cdf2d95df839c9c233a"
    );
    this.chapter003.videoTevUrl = await getResourcePath(
      "f12a50c2ac57da78ff02f3d5f430163b"
    );
    // this.chapter003.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=459ab85d46207bfcca4801dc9b319b9b";
    // this.chapter003.videoTwoUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=3817bea302b25b865ff938140939a8de";
    // this.chapter003.videoFourUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=7af72da649f6656c3b2164e708f5c132";
    // this.chapter003.videoFiveUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=e24de9b0cdd889cb73e9b472ad6f4731";
    // this.chapter003.videoSixUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=d95740ab777d9c7ca074c33317a835c4";
    // this.chapter003.videoSevenUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=0b330926f3e6ed510b48144a83199fb3";
    // this.chapter003.videoEigthUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=9f63cc4dcba6a87cbfe82a9ec4d7c77e";
    // this.chapter003.videoNineUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=c2ecf6f102a6e9b210f3db49b17b58a4";
    // this.chapter003.videoTenUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=b6943018923c0cbad4e414dc2097cb9a";
    // this.chapter003.videoEleUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=eb604885f7c01cdf2d95df839c9c233a";
    // this.chapter003.videoTevUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=f12a50c2ac57da78ff02f3d5f430163b";
    // this.chapter003.qustionData = await getQuestionData(
    //   "3",
    //   testData[3],
    //   this.config.activeBook
    // );
  },
  methods: {
    activityOne() {

 src/books/lifeCare/view/chapter004.vue

@@ -476,10 +476,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter004.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter004.publicHeader"
                      :key="index"
@@ -1355,7 +1352,7 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";
import drawflow from "@/components/drawflow";
export default {
@@ -1367,6 +1364,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  components: {
@@ -1446,25 +1447,21 @@
    };
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter004"));
    if (localData) {
      this.chapter004 = { ...Object.assign(this.chapter004, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter004"));
      if (localData) {
        this.chapter004 = { ...Object.assign(this.chapter004, localData) };
      }
      this.chapter004.videOneUrl = await getResourcePath(
        "c276be12bae3b1df0b3ce4aa01b14e1e"
      );
      this.chapter004.videoTwoUrl = await getResourcePath(
        "7eb7fe2e3c13885a96143110ca4f5654"
      );
      this.chapter004.videoFourUrl = await getResourcePath(
        "1b04691b60e5b5b207b3a4967c495d29"
      );
    }
    this.chapter004.videOneUrl = await getResourcePath(
      "c276be12bae3b1df0b3ce4aa01b14e1e"
    );
    this.chapter004.videoTwoUrl = await getResourcePath(
      "7eb7fe2e3c13885a96143110ca4f5654"
    );
    this.chapter004.videoFourUrl = await getResourcePath(
      "1b04691b60e5b5b207b3a4967c495d29"
    );
    // this.chapter004.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=c276be12bae3b1df0b3ce4aa01b14e1e";
    // this.chapter004.videoTwoUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=7eb7fe2e3c13885a96143110ca4f5654";
    // this.chapter004.videoFourUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=1b04691b60e5b5b207b3a4967c495d29";
  },
  methods: {
    activityOne() {

 src/books/lifeCare/view/chapter005.vue

@@ -627,10 +627,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter005.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter005.publicHeader"
                      :key="index"
@@ -1156,11 +1153,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter005.scoreData1.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter005.publicHeader"
                      :key="index"
@@ -1392,11 +1385,11 @@
          <p>餐前教育的注意事项是什么？</p>
          <div class="bk-tx">
            <textarea
              v-model="chapter005.textAreaItem.text28"
              v-model="chapter005.textAreaItem.text228"
              style="border: 0"
              placeholder="请输入内容"
              rows="5"
              @blur="onBlurChange('text28')"
              @blur="onBlurChange('text228')"
            ></textarea>
          </div>
          <h3 id="c017">
@@ -1666,11 +1659,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter005.scoreData2.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter005.publicHeader"
                      :key="index"
@@ -1838,11 +1827,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter005.scoreData3.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter005.publicHeader"
                      :key="index"
@@ -2171,11 +2156,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter005.scoreData4.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter005.publicHeader"
                      :key="index"
@@ -2604,7 +2585,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text1"
                      @blur="changeThVal($event, 'text1')"
                    />
@@ -2613,7 +2594,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text2"
                      @blur="changeThVal($event, 'text2')"
                    />
@@ -2622,7 +2603,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text3"
                      @blur="changeThVal($event, 'text3')"
                    />
@@ -2631,7 +2612,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text4"
                      @blur="changeThVal($event, 'text4')"
                    />
@@ -2642,7 +2623,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text5"
                      @blur="changeThVal($event, 'text5')"
                    />
@@ -2651,7 +2632,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text6"
                      @blur="changeThVal($event, 'text6')"
                    />
@@ -2660,7 +2641,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text7"
                      @blur="changeThVal($event, 'text7')"
                    />
@@ -2669,7 +2650,7 @@
                  <td>
                    <textarea
                      rows="2"
                      style="min-width: 80px;max-width:80px;font-size: 14px"
                      style="min-width: 80px; max-width: 80px; font-size: 14px"
                      v-model="chapter005.textTh.text8"
                      @blur="changeThVal($event, 'text8')"
                    />
@@ -2724,7 +2705,7 @@
              </tbody>
            </table>
          </div>
          <p><br/></p>
          <p><br /></p>
          <h3 id="c020">
            <span class="bk-h3"
              ><span class="bj1-h3">六</span>　　餐后保育　</span
@@ -3102,7 +3083,7 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";
import { getFileMd5, getPublicImage } from "../js/tool.js";
import drawflow from "@/components/drawflow";
@@ -3116,6 +3097,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -3555,30 +3540,24 @@
    drawflow,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter005"));
    if (localData) {
      this.chapter005 = { ...Object.assign(this.chapter005, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter005"));
      if (localData) {
        this.chapter005 = { ...Object.assign(this.chapter005, localData) };
      }
      this.chapter005.videOneUrl = await getResourcePath(
        "439b0bde62a5098875c77e2492676577"
      );
      this.chapter005.videoTwoUrl = await getResourcePath(
        "1a878261410b01ee8e4e0602a1fe935f"
      );
      this.chapter005.videoFourUrl = await getResourcePath(
        "6cf2619beb704b3d79de04f0775c8ba3"
      );
      this.chapter005.videoFiveUrl = await getResourcePath(
        "8400384441ad9236d5eab24f500ec2c7"
      );
    }
    this.chapter005.videOneUrl = await getResourcePath(
      "439b0bde62a5098875c77e2492676577"
    );
    this.chapter005.videoTwoUrl = await getResourcePath(
      "1a878261410b01ee8e4e0602a1fe935f"
    );
    this.chapter005.videoFourUrl = await getResourcePath(
      "6cf2619beb704b3d79de04f0775c8ba3"
    );
    this.chapter005.videoFiveUrl = await getResourcePath(
      "8400384441ad9236d5eab24f500ec2c7"
    );
    // this.chapter005.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=439b0bde62a5098875c77e2492676577";
    // this.chapter005.videoTwoUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=1a878261410b01ee8e4e0602a1fe935f";
    // this.chapter005.videoFourUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=6cf2619beb704b3d79de04f0775c8ba3";
    // this.chapter005.videoFiveUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=8400384441ad9236d5eab24f500ec2c7";
  },
  methods: {
    activityOne() {
@@ -3749,7 +3728,7 @@
            if (type == "3") {
              that.chapter005.pictrueListThree.push(getPublicImage(e));
            }
            that.$emit('Upload_initViewer',"")
            that.$emit("Upload_initViewer", "");
            localStorage.setItem("chapter005", JSON.stringify(that.chapter005));
          }, 1000);
        })

 src/books/lifeCare/view/chapter006.vue

@@ -139,11 +139,11 @@
          <p>根据以上情境，请小组讨论水与婴幼儿的健康有什么关系。</p>
          <div class="bk-tx">
            <textarea
              v-model="chapter006.textAreaItem.text1"
              v-model="chapter006.textAreaItem.text1111"
              style="border: 0"
              placeholder="请输入内容"
              rows="5"
              @blur="onBlurChange('text1')"
              @blur="onBlurChange('text1111')"
            ></textarea>
          </div>
          <h4 id="d063">
@@ -600,7 +600,7 @@
          </div>
        </div>
        <div class="bodystyle">
          <p>
          <!-- <p>
            1.根据以上情境，针对某一年龄段，以小组合作的方式共同设计一个主题墙饰，使婴幼儿能具体、直观地看到自己的饮水量，同时也便于托育园操作。在下方画出设计草图，并制作完成。
          </p>
          <div class="bk-tx">
@@ -611,6 +611,54 @@
              rows="5"
              @blur="onBlurChange('text17')"
            ></textarea>
          </div> -->
          <p class="pic-wall chapter-006">
            <span
              >1.根据以上情境，针对某一年龄段，以小组合作的方式共同设计一个主题墙饰，使婴幼儿能具体、直观地看到自己的饮水量，同时也便于托育园操作。在下方画出设计草图，并制作完成。</span
            >
            <span class="btnUpload-list btn" @click="handFile('fileThree')">
              <svg
                t="1717059899765"
                class="icon"
                viewBox="0 0 1024 1024"
                version="1.1"
                xmlns="http://www.w3.org/2000/svg"
                p-id="2633"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                width="18"
                height="18"
              >
                <path
                  d="M256.111993 608.601962c61.628148 0 122.808324 17.790888 183.220549 52.796701 88.122492-119.67252 198.387601-180.788701 328.747453-180.788701 80.122992 0 142.071121 0 191.860009 41.213424V217.522405C959.940004 168.181489 919.750516 127.992 870.345603 127.992h-716.755202A89.5944 89.5944 0 0 0 63.996 217.586401v489.569402c47.165052-64.95594 111.929004-98.489844 192.179989-98.489845z m95.994-159.99a95.994 95.994 0 1 0 0-191.988001 95.994 95.994 0 0 0 0 191.988001z m0 63.996a159.990001 159.990001 0 1 1 0-319.980001 159.990001 159.990001 0 0 1 0 319.980001zM1023.936004 619.097306a254.448097 254.448097 0 0 0-112.63296-41.469408c-38.909568-33.021936-81.27492-33.021936-143.223049-33.021936-116.664708 0-213.682645 58.23636-293.357665 177.716893l-17.726892 26.622336-26.622336-17.726892c-58.940316-39.293544-116.920692-58.620336-174.261109-58.620336-72.699456 0-125.880132 53.564652-163.317793 128.439972l-14.335104 28.606212-14.207112-7.103556A89.5944 89.5944 0 0 0 153.590401 905.031436h425.893381c6.783576 22.782576 16.63896 44.285232 29.182176 63.996H153.590401a153.590401 153.590401 0 0 1-153.590401-153.590401V217.586401A153.590401 153.590401 0 0 1 153.590401 63.996h716.691206A153.654397 153.654397 0 0 1 1023.936004 217.586401v401.510905z"
                  p-id="2634"
                ></path>
                <path
                  d="M796.366227 796.430223v-142.199112a28.414224 28.414224 0 0 1 56.892444 0v142.199112h142.199113a28.414224 28.414224 0 0 1 0 56.828448h-142.199113v142.263109a28.414224 28.414224 0 0 1-56.95644 0v-142.263109h-142.135116a28.414224 28.414224 0 0 1 0-56.828448h142.199112z"
                  p-id="2635"
                ></path>
              </svg>
            </span>
          </p>
          <div class="bk-tx">
            <div
              class="upload-list"
              v-if="chapter006.pictrueListThree.length > 0"
            >
              <div
                class="demo-image__preview openImgBox"
                v-for="item in chapter006.pictrueListThree"
                :key="item"
              >
                <img style="height: 100%" :src="item" alt="" />
              </div>
            </div>
            <div class="bk-inputUpload">
              <input
                type="file"
                id="fileThree"
                @change="handUploadFile($event, '3')"
              />
            </div>
          </div>
          <p>
            2.模拟演练。收集饮水健康教育的素材，如儿歌、故事、绘本、歌曲等，选取某年龄段（6～12月、1～2岁、2～3岁），针对婴幼儿主动喝水方面的某一问题，小组合作模拟进行饮水健康教育，组内成员进行点评，写出改进措施。
@@ -863,10 +911,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter006.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '',
                      }"
                      v-for="(header, index) in chapter006.publicHeader"
                      :key="index"
@@ -1107,11 +1152,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter006.scoreData1.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter006.publicHeader"
                      :key="index"
@@ -1131,7 +1172,7 @@
                          type="text"
                          v-model="chapter006.scoreData1[rowIndex][cellIndex]"
                          @blur="
                            updateCellGroup(
                            updateCellGroup1(
                              rowIndex,
                              cellIndex,
                              $event.target.value
@@ -1144,7 +1185,7 @@
                          type="text"
                          v-model="chapter006.scoreData1[rowIndex][cellIndex]"
                          @blur="
                            updateCellGroup(
                            updateCellGroup1(
                              rowIndex,
                              cellIndex,
                              $event.target.value
@@ -1307,8 +1348,9 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";
import { getFileMd5, getPublicImage } from "../js/tool.js";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
@@ -1319,6 +1361,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -1332,6 +1378,7 @@
        idOpenThree: true,
        isScore1Open: true,
        qustionData: {},
        pictrueListThree: [],
        // 准备饮水物品的评分标准
        publicHeader: ["序号", "考核内容", "配分", "评分标准", "扣分", "得分"],
        groupData: [
@@ -1455,15 +1502,15 @@
    examinations,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter006"));
    if (localData) {
      this.chapter006 = { ...Object.assign(this.chapter006, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter006"));
      if (localData) {
        this.chapter006 = { ...Object.assign(this.chapter006, localData) };
      }
      this.chapter006.videOneUrl = await getResourcePath(
        "04fafb0e896ffe0379edd6d695a92b13"
      );
    }
    this.chapter006.videOneUrl = await getResourcePath(
      "04fafb0e896ffe0379edd6d695a92b13"
    );
    // this.chapter006.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=04fafb0e896ffe0379edd6d695a92b13";
  },
  methods: {
    activityOne() {
@@ -1508,12 +1555,25 @@
      }
      localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
    },
    updateCellGroup1(rowIndex, cellIndex, value) {
      // 更新单元格数据
      this.$set(this.chapter006.scoreData1[rowIndex], cellIndex, value);
      if (cellIndex == 4) {
        this.$set(
          this.chapter006.scoreData1[rowIndex],
          5,
          this.chapter006.scoreData1[rowIndex][2] -
            this.chapter006.scoreData1[rowIndex][cellIndex]
        );
      }
      localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
    },
    updateCell(rowIndex, cellIndex, value) {
      // 更新单元格数据
      this.$set(this.chapter006.tableData161[rowIndex], cellIndex, value);
      localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
    },
    updateCell162(rowIndex, cellIndex, value) {
    updateCell162() {
      // 更新单元格数据
      localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
    },
@@ -1523,6 +1583,42 @@
    onRadioText() {
      localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
    },
    handUploadFile(e, type) {
      console.log(type);
      var that = this;
      const file = e.target.files[0];
      const FileName = file.name.split(".")[0];
      const Extension = file.name.split(".")[1];
      const FileType = file.type;
      let size = 1024;
      getFileMd5(file, size * 1024)
        .then((e) => {
          const imgData = new FormData();
          imgData.append("Md5", e);
          imgData.append("FileName", FileName);
          imgData.append("Extension", Extension);
          imgData.append("FileType", FileType);
          imgData.append("MetaData", null);
          imgData.append("file", file);
          that.MG.file.upload(imgData).then(() => {});
          setTimeout(() => {
            that.chapter006.pictrueListThree.push(getPublicImage(e));
            that.isLoding = false;
            this.$emit("Upload_initViewer", "");
            localStorage.setItem("chapter006", JSON.stringify(this.chapter006));
          }, 1000);
        })
        .catch((e) => {
          that.isLoding = false;
          console.error(e);
        });
    },
    handFile(str) {
      let dom = (this.container ? this.container : document).getElementById(
        str
      );
      dom.click();
    },
  },
};
</script>

 src/books/lifeCare/view/chapter007.vue

@@ -479,10 +479,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 || index == chapter007.groupData.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter007.publicHeader"
                      :key="index"
@@ -1121,11 +1118,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter007.scoreData1.length - 1
                            ? '100px'
                            : '',
                        width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter007.publicHeader"
                      :key="index"
@@ -1315,11 +1308,7 @@
                  <tr>
                    <th
                      :style="{
                        width:
                          index == 1 ||
                          index == chapter007.scoreData2.length - 1
                            ? '100px'
                            : '',
                       width: index == 3 ? '300px' : '50px',
                      }"
                      v-for="(header, index) in chapter007.publicHeader"
                      :key="index"
@@ -2414,7 +2403,7 @@
              placeholder="请输入内容"
              rows="3"
              class="textareaInput"
              @blur="onBlurChange('text68')"
              @blur="onBlurChange('text681')"
            ></textarea>
            <p class="left">其他</p>
            <textarea
@@ -2567,7 +2556,7 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";
import { getFileMd5, getPublicImage } from "../js/tool.js";

@@ -2580,6 +2569,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -2604,7 +2597,7 @@
        pictrueList: [],
        pictrueListTwo: [],
        pictrueListThree: [],
        pictrueListFour:[],
        pictrueListFour: [],
        qustionData: {},
        // 创设良好睡眠环境的评分标准
        publicHeader: ["序号", "考核内容", "配分", "评分标准", "扣分", "得分"],
@@ -2841,35 +2834,27 @@
    examinations,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter007"));
    if (localData) {
      this.chapter007 = { ...Object.assign(this.chapter007, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter007"));
      if (localData) {
        this.chapter007 = { ...Object.assign(this.chapter007, localData) };
      }
      this.chapter007.videOneUrl = await getResourcePath(
        "3c35b62a39cf8beddc28c5c1c8a847ec"
      );
      this.chapter007.videoTwoUrl = await getResourcePath(
        "4731be836c5c625584c3c94a61249cc9"
      );
      this.chapter007.videoFourUrl = await getResourcePath(
        "4889c1899ed5716aeea6ca031cd3136d"
      );
      this.chapter007.videoFiveUrl = await getResourcePath(
        "a1d60d7c5322d531939118c1aaf8feb7"
      );
      this.chapter007.videoSixUrl = await getResourcePath(
        "f92c68faa37e1f6ce9ca50f234ddad90"
      );
    }
    this.chapter007.videOneUrl = await getResourcePath(
      "3c35b62a39cf8beddc28c5c1c8a847ec"
    );
    this.chapter007.videoTwoUrl = await getResourcePath(
      "4731be836c5c625584c3c94a61249cc9"
    );
    this.chapter007.videoFourUrl = await getResourcePath(
      "4889c1899ed5716aeea6ca031cd3136d"
    );
    this.chapter007.videoFiveUrl = await getResourcePath(
      "a1d60d7c5322d531939118c1aaf8feb7"
    );
    this.chapter007.videoSixUrl = await getResourcePath(
      "f92c68faa37e1f6ce9ca50f234ddad90"
    );
    // this.chapter007.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=3c35b62a39cf8beddc28c5c1c8a847ec";
    // this.chapter007.videoTwoUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=4731be836c5c625584c3c94a61249cc9";
    // this.chapter007.videoFourUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=4889c1899ed5716aeea6ca031cd3136d";
    // this.chapter007.videoFiveUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=a1d60d7c5322d531939118c1aaf8feb7";
    // this.chapter007.videoSixUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=f92c68faa37e1f6ce9ca50f234ddad90";
  },
  methods: {
    activityOne() {
@@ -2991,7 +2976,7 @@
              that.chapter007.pictrueListFour.push(getPublicImage(e));
            }
            that.isLoding = false;
            this.$emit('Upload_initViewer',"")
            this.$emit("Upload_initViewer", "");
            localStorage.setItem("chapter007", JSON.stringify(this.chapter007));
          }, 1000);
        })

 src/books/lifeCare/view/chapter008.vue

@@ -642,11 +642,52 @@
              @blur="onBlurChange('text6')"
            ></textarea>
          </div>
          <p>2.请设计6～12月龄婴儿的一日生活记录表。</p>
          <!-- <p>2.请设计6～12月龄婴儿的一日生活记录表。</p> -->
          <p class="pic-wall">
            2.请设计6～12月龄婴儿的一日生活记录表。
            <span class="btnUpload-list" @click="handFile('fileThree')">
              <svg
                t="1717059899765"
                class="icon"
                viewBox="0 0 1024 1024"
                version="1.1"
                xmlns="http://www.w3.org/2000/svg"
                p-id="2633"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                width="18"
                height="18"
              >
                <path
                  d="M256.111993 608.601962c61.628148 0 122.808324 17.790888 183.220549 52.796701 88.122492-119.67252 198.387601-180.788701 328.747453-180.788701 80.122992 0 142.071121 0 191.860009 41.213424V217.522405C959.940004 168.181489 919.750516 127.992 870.345603 127.992h-716.755202A89.5944 89.5944 0 0 0 63.996 217.586401v489.569402c47.165052-64.95594 111.929004-98.489844 192.179989-98.489845z m95.994-159.99a95.994 95.994 0 1 0 0-191.988001 95.994 95.994 0 0 0 0 191.988001z m0 63.996a159.990001 159.990001 0 1 1 0-319.980001 159.990001 159.990001 0 0 1 0 319.980001zM1023.936004 619.097306a254.448097 254.448097 0 0 0-112.63296-41.469408c-38.909568-33.021936-81.27492-33.021936-143.223049-33.021936-116.664708 0-213.682645 58.23636-293.357665 177.716893l-17.726892 26.622336-26.622336-17.726892c-58.940316-39.293544-116.920692-58.620336-174.261109-58.620336-72.699456 0-125.880132 53.564652-163.317793 128.439972l-14.335104 28.606212-14.207112-7.103556A89.5944 89.5944 0 0 0 153.590401 905.031436h425.893381c6.783576 22.782576 16.63896 44.285232 29.182176 63.996H153.590401a153.590401 153.590401 0 0 1-153.590401-153.590401V217.586401A153.590401 153.590401 0 0 1 153.590401 63.996h716.691206A153.654397 153.654397 0 0 1 1023.936004 217.586401v401.510905z"
                  p-id="2634"
                ></path>
                <path
                  d="M796.366227 796.430223v-142.199112a28.414224 28.414224 0 0 1 56.892444 0v142.199112h142.199113a28.414224 28.414224 0 0 1 0 56.828448h-142.199113v142.263109a28.414224 28.414224 0 0 1-56.95644 0v-142.263109h-142.135116a28.414224 28.414224 0 0 1 0-56.828448h142.199112z"
                  p-id="2635"
                ></path>
              </svg>
            </span>
          </p>
          <div class="bk-tx">
            <p><br /></p>
            <p><br /></p>
            <p><br /></p>
            <div
              class="upload-list"
              v-if="chapter008.pictrueListThree.length > 0"
            >
              <div
                class="demo-image__preview openImgBox"
                v-for="item in chapter008.pictrueListThree"
                :key="item"
              >
                <img style="height: 100%" :src="item" alt="" />
              </div>
            </div>
            <div class="bk-inputUpload">
              <input
                type="file"
                id="fileThree"
                @change="handUploadFile($event, '3')"
              />
            </div>
          </div>
          <h3 id="c031">
            <span class="bk-h3"
@@ -811,7 +852,7 @@
                  <tr>
                    <th
                      :style="{
                        width: index == 1 ? '100px' : '',
                        width: index == 3 ? '330px' : '50px',
                      }"
                      v-for="(header, index) in chapter008.publicHeader"
                      :key="index"
@@ -1092,8 +1133,9 @@
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
import { getResourcePath } from "@/assets/methods/resources.js";
import examinations from "@/components/examinations/index.vue";
import { getFileMd5, getPublicImage } from "../js/tool.js";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
@@ -1104,6 +1146,10 @@
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
@@ -1119,6 +1165,7 @@
        isScore2Open: true,
        isScore3Open: true,
        qustionData: {},
        pictrueListThree:[],
        publicHeader: ["序号", "考核内容", "配分", "评分标准", "扣分", "得分"],
        // 清洁与消毒奶瓶的评分标准
        scoreData1: [
@@ -1230,20 +1277,18 @@
    examinations,
  },
  async created() {
    const localData = JSON.parse(localStorage.getItem("chapter008"));
    if (localData) {
      this.chapter008 = { ...Object.assign(this.chapter008, localData) };
    if (!this.isSearch) {
      const localData = JSON.parse(localStorage.getItem("chapter008"));
      if (localData) {
        this.chapter008 = { ...Object.assign(this.chapter008, localData) };
      }
      this.chapter008.videOneUrl = await getResourcePath(
        "80986796eb2d8ee1a47cdde606900ed0"
      );
      this.chapter008.videoTwoUrl = await getResourcePath(
        "460c7bc740882a9ad93b096a2151dd1c"
      );
    }
    this.chapter008.videOneUrl = await getResourcePath(
      "80986796eb2d8ee1a47cdde606900ed0"
    );
    this.chapter008.videoTwoUrl = await getResourcePath(
      "460c7bc740882a9ad93b096a2151dd1c"
    );
    // this.chapter008.videOneUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=80986796eb2d8ee1a47cdde606900ed0";
    // this.chapter008.videoTwoUrl =
    //   "https://jsek.bnuic.com/file/api/ApiDownload?md5=460c7bc740882a9ad93b096a2151dd1c";
  },
  methods: {
    activityOne() {
@@ -1303,6 +1348,42 @@
    onRadioText() {
      localStorage.setItem("chapter008", JSON.stringify(this.chapter008));
    },
    handUploadFile(e, type) {
      console.log(type);
      var that = this;
      const file = e.target.files[0];
      const FileName = file.name.split(".")[0];
      const Extension = file.name.split(".")[1];
      const FileType = file.type;
      let size = 1024;
      getFileMd5(file, size * 1024)
        .then((e) => {
          const imgData = new FormData();
          imgData.append("Md5", e);
          imgData.append("FileName", FileName);
          imgData.append("Extension", Extension);
          imgData.append("FileType", FileType);
          imgData.append("MetaData", null);
          imgData.append("file", file);
          that.MG.file.upload(imgData).then(() => {});
          setTimeout(() => {
            that.chapter008.pictrueListThree.push(getPublicImage(e));
            that.isLoding = false;
            this.$emit("Upload_initViewer", "");
            localStorage.setItem("chapter008", JSON.stringify(this.chapter008));
          }, 1000);
        })
        .catch((e) => {
          that.isLoding = false;
          console.error(e);
        });
    },
    handFile(str) {
      let dom = (this.container ? this.container : document).getElementById(
        str
      );
      dom.click();
    },
  },
};
</script>

 src/books/lifeCare/view/chapter009.vue

@@ -4,8 +4,8 @@
      <div v-if="showPageList.indexOf(151) > -1">
        <div class="bodystyle">
          <template>
            <p class="center">
              <img alt="" class="imz" src="../image/0011-1.jpg" />
            <p class="center coverImg">
              <img alt="" class="imz" src="../image/0158-1.jpg" />
            </p>
          </template>
        </div>
@@ -20,7 +20,6 @@
  props: {
    showPageList: {
      type: Array,
      default: [],
    },
    questionData: {
      type: Object,

 src/books/lifeCare/view/chapter010.vue

@@ -56,7 +56,8 @@
            </p>
          </div>
          <p><br /></p>
          <div class="bk-zt1">
          <div class="zt-yy-brd">
            <div class="bk-zt1">
            <div class="bj1-zt1">
              <p class="left">
                <img class="img-gn-zt" alt="" src="../image/zt-my.png" />
@@ -65,6 +66,7 @@
            <p>
              蒙台梭利：“人生的头3年胜过以后发展的各个阶段，胜过3岁直到死亡的总和。”
            </p>
          </div>
          </div>
          <p>
            婴幼儿时期是人类发展的最初阶段，是个体发展过程中生长发育最快的阶段，为个体的终身发展奠定了基础，对个体今后智力、情感、运动、社会交往等各方面都有着重要的影响。经验表明，为婴幼儿提供保健护理、充足的营养以及早期发展指导，能提高他们在未来的教育成就、健康水平，对他们获得更公平的经济与社会机会具有显著的促进作用。
@@ -93,7 +95,8 @@
            近年来，随着经济社会发展，“三孩政策”的落地与持续推进，人们对0～3岁婴幼儿照护服务的需求日益迫切，社会对其照护服务的关注度也不断提升。党的二十大提出要在“幼有所育”方面持续用力。根据《国务院办公厅关于促进3岁以下婴幼儿照护服务发展的指导意见》要求，国家卫生健康委制定并发布了《托育机构保育指导大纲（试行）》，以指导托育机构为3岁以下婴幼儿提供科学、规范的照护服务。
          </p>
          <p><br /></p>
          <div class="bk-zt1">
          <div class="zt-yy-brd">
            <div class="bk-zt1">
            <div class="bj1-zt1">
              <p class="left">
                <img class="img-gn-zt" alt="" src="../image/zt-yy.png" />
@@ -109,6 +112,7 @@
              </p>
            </div>
            <p>保育的概念是什么？</p>
          </div>
          </div>
          <h3 id="c032">
            <span class="bk1-h3"><span class="bj2-h3">一</span>　　婴幼儿生活保育的概念　</span>
@@ -613,7 +617,6 @@
  props: {
    showPageList: {
      type: Array,
      default: [],
    },
    questionData: {
      type: Object,

 src/books/lifeCare/view/chapter011.vue

@@ -418,9 +418,7 @@
</template>
<script>
export default {
  name: "chapter011",


  name: "chapter-011",
  props: {
    showPageList: {
      type: Array,

 src/books/lifeCare/view/chapter012.vue

@@ -638,7 +638,6 @@
  props: {
    showPageList: {
      type: Array,
      default: [],
    },
    questionData: {
      type: Object,

 src/books/lifeCare/view/chapter013.vue

@@ -608,7 +608,6 @@
  props: {
    showPageList: {
      type: Array,
      default: [],
    },
    questionData: {
      type: Object,

 src/books/lifeCare/view/chapter014.vue

@@ -1011,7 +1011,6 @@
          <p>
            保育员可利用玩游戏、讲故事、唱歌、谈话等形式，使婴幼儿对进餐产生兴趣。例如，饭菜端出后，让婴幼儿闻一闻、看一看，判断饭菜；用猜谜的方式让婴幼儿猜出饭菜名称；还可通过讲故事引导婴幼儿对食物产生想象。
          </p>
          <p><br /></p>
          <div class="bk-zt1">
            <!-- <div class="bj1-zt1">
            <p class="left">
@@ -1089,6 +1088,7 @@
              </div>
            </div>
          </div>
          <p><br /></p>
          <h4 class="h4-zt" id="d187">（二）介绍饭菜</h4>
          <p>
            保育员应使用富有感情色彩的语言向婴幼儿介绍饭菜的名称、内容及营养成分。生动地介绍饭菜，能起到刺激感官、激发食欲的作用。常用介绍指导语如下（见表2-5-9）。
@@ -1708,11 +1708,9 @@
<script>
export default {
  name: "chapter-014",

  props: {
    showPageList: {
      type: Array,
      default: [],
    },
    questionData: {
      type: Object,

 src/books/sportsAndHealth/css/default.less

@@ -44,9 +44,22 @@
  font-size: 18px;

  .chapter {

    textarea {
      width: 100%;
      font-family: 'FZLTXIHJW';
      padding: 2px 5px;
      box-sizing: border-box;
    }

    .swiper-button-prev,
    .swiper-button-next {
      color: #5877ba;
    }

    .page-box {
      box-sizing: border-box;
      min-height: 1150px !important;
      min-height: 1150px;
      margin-bottom: 20px;
      box-shadow: 0 3px 6px 1px #00000029;
      background-color: #fff;
@@ -85,6 +98,119 @@
          }
        }
      }
    }

    .pdf-tips-con {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: flex-start;
      // b898c7

      .pdf-wall {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        margin-left: 30px;

        .pdf-item {
          display: flex;
          justify-content: flex-start;
          align-items: center;
          border: 2px dashed #b898c7;
          margin: 10px;
          padding: 2px 10px;
          border-radius: 5px;
          box-sizing: border-box;

          span {
            font-size: 14px;
            text-align: center;
            font-family: 'FZLTXIHJW';
            display: flex;
            align-items: center;
            justify-content: flex-start;

            svg {
              fill: #b898c7;
            }
          }

          span:nth-child(2) {
            padding-top: 5px;
            box-sizing: border-box;
          }

          span:hover {
            color: #b898c7;
            cursor: pointer;
            text-decoration: underline;
            -webkit-user-select: none;
            /* Safari 3.1+ */
            -moz-user-select: none;
            /* Firefox 2+ */
            -ms-user-select: none;
            /* IE 10+ */
            user-select: none;
            /* 标准语法 */
          }
        }
      }
    }

    .leftTable {
      table {
        tr td {
          text-align: left !important;
        }
      }
    }

    .parentVideo {
      width: 100%;
      display: flex;
      justify-content: flex-start;
      flex-wrap: wrap;

      .videoItem {
        width: 200px;
        margin: 3px 4px;
        border: 1px dotted #30aad1;

        video {
          width: 100%;
        }

        video::-webkit-media-text-track-display {
          /* 这里可以添加自定义的样式代码 */
          color: red;
          /* 文字颜色 */
          background-color: yellow;
          /* 背景颜色 */
        }

        span {
          display: flex;
          justify-content: center;
          font-size: 14px;
          text-align: center;
          font-family: 'FZLTXIHJW';
        }
      }
    }

    .gif-Con {
      display: flex;
      justify-content: center;
      align-items: center;
      border: 0 !important;
      padding: 1px !important;
    }

    .imgBox-003 {
      width: 100%;
      height: 220px;
    }

    .tablePublic {
@@ -152,8 +278,10 @@
          background-color: #d6dbee;
          color: #f49a4c;
          text-align: center;
          padding: 5px 20px;
          font-size: 16px;
          padding: 5px 10px;
          font-size: 14px;
          font-family: 'FZLTXIHJW';
          font-weight: 900;
        }

        tr td {
@@ -162,6 +290,7 @@
          padding: 3px 10px;
          font-size: 14px;
          line-height: 25px;
          font-family: 'FZLTXIHJW';

          input {
            cursor: pointer;
@@ -224,7 +353,6 @@

      textarea:focus {
        outline: none;
        text-indent: 2em;
      }
    }

@@ -232,11 +360,13 @@
      min-width: 100px;
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      top: -20px;
      left: 10px;
      background-color: #d6dbee;
      padding: 5px;
      border: 0.15em dotted #d6dbee;
      padding: 2px 8px 3px 2px;
      box-sizing: border-box;
      color: #5877ba;
      font-family: "FZLTXIHJW";
@@ -248,8 +378,8 @@
        width: 25px;
        height: 25px;
        border-radius: 5px;
        background-color: #007aff;
        border: 1px solid #007aff;
        background-color: #b898c7;
        border: 1px solid #b898c7;
        display: flex;
        justify-content: center;
        align-items: center;
@@ -263,11 +393,27 @@

      .icon:hover {
        background-color: #fff;
        border: 1px solid #007aff;
        border: 1px solid #b898c7;

        svg {
          fill: #007aff;
          fill: #b898c7;
        }
      }
    }

    .img-float {
      width: 250px;
      float: left;
      height: auto;
      margin: auto;
      margin-right: 20px;

      img{
        width: 100%;
      }

      p{
        margin: 0;
      }
    }

@@ -310,43 +456,54 @@

    .pdf-text {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      align-items: flex-start;
      margin-bottom: 20px;

      p {
        margin: 0;
        margin-right: 10px;
      }

      .pdf-con {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        border: 2px dotted #5d78bb;
        align-items: center;
        padding: 10px 0;
        box-sizing: border-box;
        border-radius: 10px;
        margin-left: 10px;
        margin-top: -50px;

        .pdf-view {
          min-width: 160px;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;

          img {
            width: 80px;
          }
          border: 0.15em dashed #b898c7;
          margin-right: 15px;
          padding: 0 15px;
          border-radius: 5px;

          span {
            min-width: 150px;
            font-size: 14px;
            text-align: center;
            font-family: 'FZLTXIHJW';
            display: flex;
            align-items: center;
            justify-content: flex-start;

            svg {
              fill: #b898c7;
            }
          }

          span:nth-child(2) {
            padding-top: 5px;
            box-sizing: border-box;
          }

          span:hover {
            color: #5877ba;
            color: #b898c7;
            cursor: pointer;
            text-decoration: underline;
            -webkit-user-select: none;
@@ -359,6 +516,10 @@
            /* 标准语法 */
          }
        }
      }

      .pdf-con-15 {
        margin-top: -20px;
      }
    }

@@ -1265,7 +1426,7 @@

    div.bk-xyx {
      background-color: #f9f7fc;
      border: 0.15em dotted #95b2dc;
      border: 0.15em dotted #b898c7;
      padding: 0.5em 1.2em;
      margin-bottom: 2em;
      margin-top: 0.5em;
@@ -1296,6 +1457,29 @@
      margin-top: 0.5em;
      border-radius: 1em;
      position: relative;

      .xspj-text {
        width: 100%;
        display: flex;
        justify-content: center;

        textarea {
          width: 100%;
          max-width: 560px;
          border: 1px solid #89a0d0;
          border-radius: 5px;
          font-size: 14px;
          font-family: 'FZLTXIHJW';
          text-indent: 2em;
          line-height: 22px;
          padding: 2px 5px;
          box-sizing: border-box;
        }

        textarea:focus {
          outline: none;
        }
      }
    }

    p.bj-xspj {
@@ -1424,9 +1608,13 @@
    }

    .bj1-mk {
      background-color: #99b4df;
      background-image: url('../image/mk.png');
      background-position: center;
      background-repeat: no-repeat;
      background-size: 100% 100%;
      color: #ffffff;
      padding: 0.3em 0.7em 0.3em 0.7em;
      padding: 5px 28px 15px 25px;
      // padding: 0.3em 0.7em 0.3em 0.7em;
      font-weight: bold;
      font-size: 1em;
    }
@@ -1441,6 +1629,76 @@
      font-weight: bold;
    }
  }

  @media screen and (max-width: 800px) {
    .chapter {
      .pdf-tips-con {
        width: 100%;
        min-width: 200px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        padding: 20px 0;

        .pdf-wall {
          max-width: 180px;
          position: relative;
          left: 30px;
          top: 25px;
          border: 2px dotted #5d78bb;
          display: flex;
          flex-direction: column;
          justify-content: flex-start;
          align-items: flex-start;
          border: 2px dotted #5d78bb;
          padding: 10px;
          box-sizing: border-box;
          border-radius: 10px;

          .pdf-item {
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            align-items: center;

            img {
              width: 80px;
            }

            span {
              min-width: 150px;
              font-size: 14px;
              text-align: center;
              font-family: 'FZLTXIHJW';
              line-height: 20px;
            }

            span:hover {
              color: #5877ba;
              cursor: pointer;
              text-decoration: underline;
              -webkit-user-select: none;
              /* Safari 3.1+ */
              -moz-user-select: none;
              /* Firefox 2+ */
              -ms-user-select: none;
              /* IE 10+ */
              user-select: none;
              /* 标准语法 */
            }
          }
        }
      }

      .parentVideo {
        width: 100%;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
      }
    }
  }
}

body {

 src/books/sportsAndHealth/image/352-1.png

 src/books/sportsAndHealth/image/352-2.png

 src/books/sportsAndHealth/image/352-3.png

 src/books/sportsAndHealth/image/353-1.png

 src/books/sportsAndHealth/image/353-2.png

 src/books/sportsAndHealth/image/353-3.png

 src/books/sportsAndHealth/image/353-4.png

 src/books/sportsAndHealth/image/354-1.png

 src/books/sportsAndHealth/image/354-2.png

 src/books/sportsAndHealth/image/354-3.png

 src/books/sportsAndHealth/image/354-4.png

 src/books/sportsAndHealth/image/355-1.png

 src/books/sportsAndHealth/image/355-2.png

 src/books/sportsAndHealth/image/355-3.png

 src/books/sportsAndHealth/image/356-1.png

 src/books/sportsAndHealth/image/356-2.png

 src/books/sportsAndHealth/image/356-3.png

 src/books/sportsAndHealth/image/356-4.png

 src/books/sportsAndHealth/image/356-5.png

 src/books/sportsAndHealth/image/357-1.png

 src/books/sportsAndHealth/image/357-2.png

 src/books/sportsAndHealth/image/357-3.png

 src/books/sportsAndHealth/image/357-4.png

 src/books/sportsAndHealth/image/357-5.png

 src/books/sportsAndHealth/image/gif/T-zi.gif

 src/books/sportsAndHealth/image/mk.png

 src/books/sportsAndHealth/image/sports02.png

 src/books/sportsAndHealth/index.vue

@@ -17,23 +17,27 @@
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        :isSearch="isSearch"
      />
      <ChapterTwo
        v-if="showCatalogList.indexOf(3) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
        @eventPublic="swdtChange"
        :isSearch="isSearch"
      />
      <!-- <ChapterThree
      <ChapterThree
        v-if="showCatalogList.indexOf(4) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      /> -->
      <!-- <ChapterFour
        :isSearch="isSearch"
      />
      <ChapterFour
        v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      /> -->
        :isSearch="isSearch"
      />
      <!-- <ChapterFive
        v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
@@ -104,6 +108,8 @@
import front001 from "./view/front001";
import ChapterOne from "./view/chapter001";
import ChapterTwo from "./view/chapter002";
import ChapterThree from "./view/testDynaicTable";
import ChapterFour from "./view/testPp";
// import ChapterThree from "./view/chapter003";
// import ChapterFour from "./view/chapter004";
// import ChapterFive from "./view/chapter005";
@@ -131,7 +137,7 @@
export default {
  data() {
    return {
      catalogLength: 19, // 总章节数
      catalogLength: 5, // 总章节数
      showCatalogList: [], // 显示的章节
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
@@ -142,6 +148,7 @@
      loadPageList: [],
      questionData: {},
      renderSignMap: {},
      isSearch: false,
    };
  },
  computed: {
@@ -187,7 +194,7 @@
  },
  mounted() {
    // 默认加载章节
    this.showCatalogList = [2];
    this.showCatalogList = [1];
    // 滚动监听节流
    this.throttledScrollHandler = _.throttle(
      this.scrollFun,
@@ -775,8 +782,8 @@
    front001,
    ChapterOne,
    ChapterTwo,
    // ChapterThree,
    // ChapterFour,
    ChapterThree,
    ChapterFour,
    // ChapterFive,
    // chapterSix,
    // chapterSeven,

 src/books/sportsAndHealth/view/chapter001.vue

@@ -1,6 +1,6 @@
<template>
  <div class="chapter" num="2">
    <div class="page-box" page="12" style="background-color: rgb(240, 241, 242)">
    <div class="page-box" page="12">
      <div v-if="showPageList.indexOf(12) > -1">
        <div class="bodystyle">
          <div class="bodystyle-chapter001">
@@ -19,7 +19,7 @@
              </p>
              </div>
              <div class="bj-chapter001-con-icon">
                <img src="../image/sports.png" alt="">
                <img src="../image/sports02.png" alt="">
              </div>
            </div>
          </div>

 src/books/sportsAndHealth/view/chapter002.vue

@@ -122,7 +122,7 @@
              </ul>
            </div>
            <!-- <p>
              请同学们登录课程平台<a id="w1"></a
              请同学们<a id="w1"></a
              ><a href="chapter002.html#m1"><sup>[1]</sup></a
              >查阅“健康概念的演变”。
            </p> -->
@@ -459,15 +459,14 @@
    <div class="page-box" page="15">
      <div v-if="showPageList.indexOf(15) > -1">
        <div class="bodystyle">
          <p class="center openImgBox">
            <!-- <el-image
              class="chapter001-img-0018 img-c"
              :src="picOneUrl"
              :preview-src-list="picArr"
            /> -->
            <img class="img-c" alt="" src="../image/0017-1.jpg" />
          </p>
          <p class="img">图1-1-1 人们对健康的认识</p>
          <div class="img-float openImgBox">
              <img
                class="img-c"
                alt=""
                src="../image/0017-1.jpg"
              />
            <p class="img" style="color: #f4ac94; font-size: 14px">图1-1-1 人们对健康的认识</p>
          </div>
          <p>
            目前，人们对健康的认识已经丰富到 7
            个维度（见图1-1-1）。其中，躯体维度指身体健康；情绪、社会和职业维度指心理、社会和道德的健康；理智维度指对各种信息的处理能力；心灵维度包括信心、信任、信仰和信念；环境维度包括个体与社会、自然界的和谐关系。
@@ -512,10 +511,8 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行“8种健康状况测评”。
            </div>
            <!-- <p>请同学们登录课程平台进行“8种健康状况测评”。</p> -->
            <div class="public-tips">请同学们进行“8种健康状况测评”。</div>
            <!-- <p>请同学们进行“8种健康状况测评”。</p> -->
            <div class="bj-byb" v-if="chapter002.isShowXyx03">
              <div class="byb-title">8 种健康状况测评</div>
              <p>
@@ -874,10 +871,8 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行“生活事件评价”。
            </div>
            <!-- <p>请同学们登录课程平台进行“生活事件评价”。</p> -->
            <div class="public-tips">请同学们进行“生活事件评价”。</div>
            <!-- <p>请同学们进行“生活事件评价”。</p> -->
            <div v-if="chapter002.isShowXyx04">
              <div class="xyx-title">生活事件评价</div>
              <div class="xyx-text">
@@ -2482,7 +2477,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台查阅“适宜运动环境的选择”，并与同学讨论校园内哪些地方适宜锻炼
              请同学们查阅“适宜运动环境的选择”，并与同学讨论校园内哪些地方适宜锻炼
              。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx06">
@@ -2510,12 +2505,12 @@
              </p>
            </div>
            <!-- <p>
          请同学们登录课程平台<a id="w1"></a
          请同学们<a id="w1"></a
          ><a href="chapter002.html#m1"><sup>[1]</sup></a
          >查阅“健康概念的演变”。
        </p> -->
            <!-- <p>
          请同学们登录课程平台查阅“适宜运动环境的选择”，并与同学讨论校园内哪些地方适宜锻炼。
          请同学们查阅“适宜运动环境的选择”，并与同学讨论校园内哪些地方适宜锻炼。
        </p> -->
          </div>
          <div class="bk-xyx">
@@ -2538,7 +2533,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“个人运动处方制定”相关内容，根据自身情况设计专属运动处方，并向老师汇报。
              请同学们学习“个人运动处方制定”相关内容，根据自身情况设计专属运动处方，并向老师汇报。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx07">
              <div class="xyx-title">个人运动处方的制定</div>
@@ -2632,7 +2627,7 @@
              </p>
            </div>
            <!-- <p>
          请同学们登录课程平台学习“个人运动处方制定”相关内容，根据自身情况设计专属运动处方，并向老师汇报。
          请同学们学习“个人运动处方制定”相关内容，根据自身情况设计专属运动处方，并向老师汇报。
        </p> -->
          </div>
        </div>
@@ -2676,7 +2671,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“一评二控三减四健——全民健康生活方式行动”。
              请同学们学习“一评二控三减四健——全民健康生活方式行动”。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx08">
              <div class="xyx-title">
@@ -2690,7 +2685,7 @@
              <p>“四健”即健康体重、健康口腔、健康骨骼、健康心理。</p>
            </div>
            <!-- <p>
          请同学们登录课程平台学习“一评二控三减四健——全民健康生活方式行动”。
          请同学们学习“一评二控三减四健——全民健康生活方式行动”。
        </p> -->
          </div>
          <h5 id="e011">（七）注重心理健康</h5>
@@ -2727,9 +2722,7 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“健康素养66条”。
            </div>
            <div class="public-tips">请同学们学习“健康素养66条”。</div>
            <!-- <p></p> -->
            <div class="xyx-text" v-if="chapter002.isShowXyx09">
              <div class="xyx-title">健康素养66条</div>
@@ -2927,11 +2920,11 @@
                </svg>
              </div>
            </div>
            <!-- <p>请同学们登录课程平台学习“健康行动计划的制订与实施”。</p>
            <!-- <p>请同学们学习“健康行动计划的制订与实施”。</p>
         -->
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“健康行动计划的制订与实施”。
              请同学们学习“健康行动计划的制订与实施”。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx10">
              <div class="xyx-title">健康行动计划的制订与实施</div>
@@ -3100,12 +3093,21 @@
            <p class="block">
              1.结合情境导入中的案例，谈一谈我们应该吸取哪些教训。
            </p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj01"></textarea>
            </div>
            <p class="block">
              2.结合自己的实际情况和前面的运动处方，制订一份运动计划，进行为期1个月、每天至少40分钟的运动打卡活动，并根据实施情况进行自我评价。
            </p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj02"></textarea>
            </div>
            <p class="block">
              3.对照中职学生健康生活方式中的具体内容与要求，评价一下自己还有哪些做得不够好，运用在课程平台中学习到的健康行动计划的制订与实施方法，制订自己的健康行动计划并实施，尽快养成自己的健康生活方式。
            </p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj03"></textarea>
            </div>
          </div>
          <h3 id="c003">专题三 提高心理健康的水平</h3>
          <div class="bk-ztgs">
@@ -3167,7 +3169,7 @@
          </p>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">学一学</p>
            <p>请同学们登录课程平台参阅“马斯洛的心理健康标准”。</p>
            <p>请同学们参阅“马斯洛的心理健康标准”。</p>
          </div> -->
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">
@@ -3188,9 +3190,7 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台参阅“马斯洛的心理健康标准”。
            </div>
            <div class="public-tips">请同学们参阅“马斯洛的心理健康标准”。</div>
            <div v-if="chapter002.isShowXyx01">
              <div class="xyx-title">马斯洛的心理健康标准</div>
              <ul class="xyx-ul">
@@ -3242,7 +3242,7 @@
              </ul>
            </div>
            <!-- <p>
              请同学们登录课程平台<a id="w1"></a
              请同学们<a id="w1"></a
              ><a href="chapter002.html#m1"><sup>[1]</sup></a
              >查阅“健康概念的演变”。
            </p> -->
@@ -3258,7 +3258,7 @@
          </p>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">测一测</p>
            <p>请同学们登录课程平台进行“社会支持量表”的测试。</p>
            <p>请同学们进行“社会支持量表”的测试。</p>
          </div> -->
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">
@@ -3279,9 +3279,7 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行“社会支持量表”的测试。
            </div>
            <div class="public-tips">请同学们进行“社会支持量表”的测试。</div>
            <div v-if="chapter002.isShowXyx02">
              <div class="xyx-title">社会支持量表</div>
              <div class="xyx-text">
@@ -4102,7 +4100,7 @@
          </p>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">测一测</p>
            <p>请同学们登录课程平台进行“整体自尊量表”的测试。</p>
            <p>请同学们进行“整体自尊量表”的测试。</p>
          </div> -->
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">
@@ -4123,9 +4121,7 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行“整体自尊量表”的测试。
            </div>
            <div class="public-tips">请同学们进行“整体自尊量表”的测试。</div>
            <div v-if="chapter002.isShowXyx02">
              <div class="xyx-title">整体自尊量表</div>
              <div class="xyx-text">请按下表对自己的自尊情况进行测评。</div>
@@ -4545,7 +4541,7 @@
          <h5 id="e015">（一）自我个性的认识</h5>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">测一测</p>
            <p>请同学们登录课程平台进行“我的个性成熟度”的测试。</p>
            <p>请同学们进行“我的个性成熟度”的测试。</p>
          </div> -->
          <br />
          <div class="bk-xyx">
@@ -4567,9 +4563,7 @@
              </div>
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行“我的个性成熟度”的测试
            </div>
            <div class="public-tips">请同学们进行“我的个性成熟度”的测试</div>
            <div v-if="chapter002.isShowXyx01">
              <div class="xyx-title">我的个性成熟度</div>
              <p>
@@ -4643,7 +4637,7 @@
            青春期个体社会化是基本社会化的最后阶段，也是极为重要的人生阶段。有人将其称为“人生的第二次诞生”“心理断乳时期”等。我们既要正确认识自己，也要形成与他人、与社会的健康联结。身边的同学、朋友、老师、家长等都是我们人际圈里的重要组成部分，如何与他们建立良好的关系，帮助我们更加适应这个社会的发展呢？
          </p>
          <p><b>1.与成年人交往</b></p>
          <p>
          <p style="margin-bottom: 30px">
            由于青春期心理“上锁”的特征，我们容易与老师、父母发生冲突，特别是与父母发生冲突。面对冲突，我们需要克制自己，静下心来思考自己内心的想法，寻找合适的沟通机会；当我们不被理解、不被尊重时，我们可以试着向老师或父母真实地表达自己内心的期待和想法；在遇到困难时，我们可以找自己信任和尊重的成年人寻求帮助。
          </p>
          <!-- <div class="bk-xyx">
@@ -4834,7 +4828,7 @@
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">测一测</p>
            <p class="block">
              请同学们登录课程平台学习“青春期常见生理问题”，看看自己处于哪一阶段。
              请同学们学习“青春期常见生理问题”，看看自己处于哪一阶段。
            </p>
          </div> -->
          <div class="bk-xyx">
@@ -4857,7 +4851,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“青春期常见生理问题”，看看自己处于哪一阶段。
              请同学们学习“青春期常见生理问题”，看看自己处于哪一阶段。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx07">
              <div class="xyx-title">青春期常见生理问题</div>
@@ -4997,11 +4991,11 @@
            青春期是同学们由心理幼稚走向心理成熟的过渡期，青春的烦恼是成长的印记。同学们遇到烦恼、矛盾与困惑时，应该学着接纳自我，试着与信任的朋友、老师、家长坦诚交流与沟通，获得他们的帮助和理解，从而顺利平稳度过青春期。
          </p>
          <h4 id="d015">三、青春期性心理与异性交往</h4>
          <h5 id="e026">（一）青春期性心理</h5>
          <h5 id="e026" style="margin-bottom: 30px">（一）青春期性心理</h5>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">测一测</p>
            <p class="block">
              请同学们登录课程平台进行异性交往情况自评，并与同学们交流。
              请同学们进行异性交往情况自评，并与同学们交流。
            </p>
          </div> -->
          <div class="bk-xyx">
@@ -5024,7 +5018,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台进行异性交往情况自评，并与同学们交流。
              请同学们进行异性交往情况自评，并与同学们交流。
            </div>
            <div v-if="chapter002.isShowXyx04">
              <div class="xyx-title">异性交往情况自评</div>
@@ -5253,7 +5247,7 @@
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">学一学</p>
            <p class="block">
              请同学们登录课程平台学习“避孕方法及避孕失败后的紧急补救措施”。
              请同学们学习“避孕方法及避孕失败后的紧急补救措施”。
            </p>
          </div> -->
          <div class="bk-xyx">
@@ -5276,7 +5270,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“避孕方法及避孕失败后的紧急补救措施”。
              请同学们学习“避孕方法及避孕失败后的紧急补救措施”。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx07">
              <div class="xyx-title">避孕方法及避孕失败后的紧急补救措施</div>
@@ -5301,31 +5295,27 @@
          </div>
          <div class="bk-xspj">
            <p class="bj-sbx">学习评价</p>
            <p class="block">1.我的各项生长发育生理指标</p>
            <p class="block">
              1.我的各项生长发育生理指标<a id="w3"></a
              ><a href="#m3"><sup>[3]</sup></a
              >。
            </p>
            <p class="block">
              体重指数<a id="w4"></a
              ><a href="#m4"><sup>[4]</sup></a
              >：<input
              体重指数：<input
                @change="changeAssess($event, 'text22')"
                maxlength="5"
                style="width:50px"
                style="width: 50px"
                :value="chapter002.tkItem01.text22"
                class="assess"
                type="text"
              />千克/米<sup>2</sup>　低体重　正常 超重 肥胖
            </p>
            <p class="block">肺活量：<input
            <p class="block">
              肺活量：<input
                @change="changeAssess($event, 'text33')"
                maxlength="5"
                style="width:50px"
                style="width: 50px"
                :value="chapter002.tkItem01.text33"
                class="assess"
                type="text"
              />毫升 偏低　正常　良好 优秀</p>
              />毫升 偏低　正常　良好 优秀
            </p>
            <p class="block">脊柱　正常　侧弯　前凸或后凸</p>
            <p class="block">性发育：　正常　异常</p>
            <p class="block">总体： 偏差　正常　良好</p>
@@ -5345,7 +5335,7 @@
                :value="chapter002.tkItem01.text55"
                class="assess"
                type="text"
                style="width:30px"
                style="width: 30px"
              />期，现在的心理状态是<input
                @change="changeAssess($event, 'text66')"
                maxlength="20"
@@ -5366,6 +5356,9 @@
            <p class="block">
              中职学校三年级女生小C和男生小D是同班同学，两人经常一起交流学习和生活中遇到的问题。不知不觉中两人产生了好感，陷入了恋爱中。一个周末，小D趁家里没人，便主动邀请小C到家里玩。相处间小D突然心生杂念，提出要与小C发生性行为。小C一时手足无措，不知如何是好。
            </p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj04"></textarea>
            </div>
          </div>
        </div>
      </div>
@@ -5423,7 +5416,7 @@
          </p>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">学一学</p>
            <p>请同学们登录课程平台学习“科学防护，远离结核危害”。</p>
            <p>请同学们学习“科学防护，远离结核危害”。</p>
          </div> -->
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">
@@ -5445,7 +5438,7 @@
            </div>
            <br />
            <div class="public-tips">
              请同学们登录课程平台学习“科学防护，远离结核危害”。
              请同学们学习“科学防护，远离结核危害”。
            </div>
            <div class="xyx-text" v-if="chapter002.isShowXyx07">
              <div class="xyx-title">科学防护，远离结核危害</div>
@@ -5645,11 +5638,11 @@
            我们要遵循“三减”（减盐、减油、减糖）的饮食方式，避免偏食、挑食和暴饮暴食。
          </p>
          <h5 id="e035">（三）不吸烟、不饮酒</h5>
          <br>
          <br />
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">议一议</p>
            <p>
              请同学们登录课程平台学习“缓解心理压力的方法”，并与同学交流自己的心得体会。
              请同学们学习“缓解心理压力的方法”，并与同学交流自己的心得体会。
            </p>
          </div> -->
          <div class="bk-xyx">
@@ -5672,7 +5665,7 @@
            </div>
            <br />
            <p class="public-tips">
              请同学们登录课程平台学习“缓解心理压力的方法”，并与同学交流自己的心得体会。
              请同学们学习“缓解心理压力的方法”，并与同学交流自己的心得体会。
            </p>
            <div class="xyx-text" v-if="chapter002.isShowXyx05">
              <div class="xyx-title">缓解心理压力的方法</div>
@@ -5697,15 +5690,27 @@
            <p class="block">
              1.对照自身实际，你处在生活方式疾病链中的什么位置？应该怎样应对？
            </p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj05"></textarea>
            </div>
            <p class="block">2.你认为有效缓解心理压力的方法主要有哪些？</p>
            <div class="xspj-text">
              <textarea rows="6" v-model="chapter002.textXxpj06"></textarea>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- <div class="page-box" page="34">
      <div v-if="showPageList.indexOf(34) > -1">
        <div class="bodystyle">
        </div>
      </div>
    </div> -->
  </div>
</template>
<script>
import getResourcePath from "@/assets/methods/resources.js";
export default {
  name: "chapter-2",
  props: {
@@ -5715,6 +5720,10 @@
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
@@ -5722,7 +5731,6 @@
      isShowScore2: false,
      isShowScore3: false,
      isShowScore4: false,
      pingpang: require("../image/pdf.png"),
      chapter002: {
        isShowXyx01: true,
        isShowXyx02: true,
@@ -5804,13 +5812,6 @@
    },
    activityXyx11() {
      this.chapter002.isShowXyx11 = !this.chapter002.isShowXyx11;
    },
    toUrl(val) {
      if (val == 1) {
        window.open(getResourcePath("54741d14a21eb47b2ed06a2231271cd5"));
      } else {
        window.open(getResourcePath("1b7ecc924bfab900ec10f0ed4bb2466b"));
      }
    },
    submit(val) {
      if (val == 1) this.isShowScore1 = true;

 src/books/sportsAndHealth/view/chapter005.html

@@ -1028,6 +1028,8 @@
</div>
<h4 class="h4-dy3" id="d066"><span class="h4-dy3s">一</span>　了解乒乓球运动</h4>
<p>乒乓球运动是一项由两名或四名运动员在乒乓球桌上进行隔网攻守的运动，在世界上许多地方流行。乒乓球运动1900年起源于英国，20世纪初在欧洲和亚洲蓬勃开展起来。乒乓球运动易于开展，打法多样，球路变化丰富，技术动作要求协调、灵敏、精确，观赏性强。乒乓球运动能有效发展力量、速度、耐力、灵敏性等身体素质，同时也能锻炼和培养勇敢、顽强、机智、果断等心理品质。乒乓球运动对今后从事需久坐、久站的职业，尤其是需要进行精细化操作的职业人群身体状况的改善有积极的作用。“乒乓精神”所蕴含的技术创新和精益求精也是同学们应该学习和践行的职业精神。乒乓球运动在国内外广泛开展，乒乓球世界杯、世锦赛与奥运会并称世界乒乓球三大赛事。</p>


<h4 class="h4-dy3" id="d067"><span class="h4-dy3s">二</span>　学练乒乓球技能</h4>
<h5 id="e100"><span class="bj1-mk">模块一</span></h5>
<p>本模块设置了乒乓球运动中较为基础的技战术内容。其中，单项技术学练包括握拍方法与核心技术、反手推挡、正手攻球，以及课程平台中的平击发球；基本战术学练包括发平击球抢攻，以及课程平台中的接平击球抢攻；组合技能练习设置的是1/2 左推+右攻，以及课程平台中的推挡+侧身攻。同学们学练本模块的内容，能够提高基本的技战术水平，为参与本模块设置的比赛提供保障，为后续模块的学练奠定基础。</p>
@@ -1050,6 +1052,8 @@
<p><span class="zt-cs">2.反手推挡</span></p>
<p>（1）动作要领</p>
<p>击球前，左脚稍前站立，身体离台40～50厘米；通过脚步移动来到球落点的侧前方，前臂内旋将球拍后引至身体左侧稍后；在上升期击球的中上部；击球后前臂向上方外转90°，然后迅速还原成击球前的准备姿势。</p>


<p>（2）学练建议</p>
<p>①在练习过程中先进行颠球练习，完成50次颠球后进行对墙练习。</p>
<p>②上台练习，完成支撑动作。</p>
@@ -1074,6 +1078,8 @@
<p>②上台练习，完成支撑动作。</p>
<p>③在支撑熟练的基础上完成乒乓球卷带动作。</p>
<p>④拓展练习：通过减慢正手攻球速度巩固技术，通过加快击球速度提高技术质量。</p>


<p><span class="zt-ls">（二）基本战术学练</span></p>
<p><span class="zt-cs">发平击球抢攻</span></p>
<p>（1）战术方法</p>
@@ -1102,7 +1108,12 @@
<p>（2）练习要求</p>
<p>站在球台的左半台，离球台40～50厘米。推挡为直线，正手攻球为斜线，落点位置在左半台的边线位置。通过步法移动保证击球点在身体的侧前方。</p>
<h5 id="e101"><span class="bj1-mk">模块二</span></h5>
<p>本模块在上一模块学练的基础上，进阶性地设置了乒乓球运动新的学练内容。其中，单项技术学练包括攻球、推挡和快搓，慢搓，以及课程平台中的正手快带、转与不转球发球；基本战术学练包括对攻战术，以及课程平台中的发转与不转球抢攻；组合技能练习设置的是推挡+侧身攻，以及课程平台中的左推+右攻。同学们学练本模块的内容，在掌握一定难度技战术和组合技能的基础上，能够参与本模块设置的比赛活动，并为难度更高的下一模块的学练做好铺垫。</p>
<p>本模块在上一模块学练的基础上，进阶性地设置了乒乓球运动新的学练内容。其中，单项技术学练包括攻球、推挡和快搓，慢搓，以及课程平台中的正手快带、转与不转球发球；
  
  
  
  
基本战术学练包括对攻战术，以及课程平台中的发转与不转球抢攻；组合技能练习设置的是推挡+侧身攻，以及课程平台中的左推+右攻。同学们学练本模块的内容，在掌握一定难度技战术和组合技能的基础上，能够参与本模块设置的比赛活动，并为难度更高的下一模块的学练做好铺垫。</p>
<p><span class="zt-ls">（一）单项技术学练</span></p>
<p><span class="zt-cs">1.攻球、推挡和快搓</span></p>
<p>（1）动作要领</p>
@@ -1128,6 +1139,8 @@
<p class="center"><img class="img-b" alt="" src="../image/0122-2.jpg"/></p>
<p class="img">图3-5-5 慢搓</p>
<p>搓球是近台还击下旋球的一种基本技术，可用它为拉弧圈球创造条件。它与攻球技术结合起来可以形成搓攻战术。搓球在接发球时可以有效地过渡，为自己下一板创造进攻机会。</p>


<p>（1）动作要领</p>
<p>慢搓要求右脚在前或两脚平行站立，身体离台40～50厘米。手臂外旋使拍面角度后仰，前臂向左上方引拍至胸前，横握拍手腕适当外展，直握拍手腕作屈，拍头指向斜上方。当来球跳至下降前期，前臂带动手腕加速向右前下方。用力摩擦球拍面后，仰击球的中下偏外侧的部位。击球后，前臂顺势前送，并注意还原。</p>
<p>（2）学练建议</p>
@@ -1163,6 +1176,8 @@
<p><span class="zt-cs">推挡+侧身攻</span></p>
<p>（1）练习方法</p>
<p>①准备动作：左脚在前，右脚在后，两脚间距比肩稍宽，低头含胸，两眼平视，手腕内旋，球拍在反手位的侧前方。</p>


<p>②动作要领：站在左半台先进行推斜线练习，然后通过步法移动到左侧边线外，同时将执拍手移到正手位的侧身位，调整重心到右脚，做好正手攻斜线的准备。在击球前，手腕外展；击球过程中，保证击球点在身体的侧前方，同时前臂带动手腕由外展变为内旋，挥拍至左眼上方，然后通过跳步移动至反手位，回到准备动作阶段。</p>
<p>（2）练习要求</p>
<p>站在左半台边，离球台40～50厘米。推挡和侧身攻为斜线，落点在球台的中线或左侧边位置。通过步法移动完成技术组合动作。</p>
@@ -1179,6 +1194,8 @@
<p>②完成单个弧圈球技术练习。</p>
<p>③在支撑熟练的基础上完成连续的弧圈球技术练习。</p>
<p>④拓展练习：配合多球来巩固技术动作。</p>


<p><span class="zt-cs">2.正手发左侧上（下）旋球</span></p>
<p>（1）动作要领</p>
<p>正手发左侧上（下）旋球时，左脚在前，右脚在后，身体侧向球台，身体重心下降。左手将球向上抛起，同时右臂向右后上方引拍，握拍手腕外展，腰部略向右转动。当球下降至接近网高时，前臂加速向左前方挥摆，触球时手臂、手腕发力，直握拍手腕内旋，横握拍手腕内收，腰部配合向左转。发侧上旋球时，拍面略微立起，击球的中部向左侧上方摩擦；发侧下旋球时，拍面略后仰，击球的中下部向左侧下方向摩擦。随势挥拍，迅速还原。</p>
@@ -1212,6 +1229,9 @@
<p>3.通过步法移动，寻找最佳击球点，能有效地提高技术质量。</p>
<p>4.注意发球线路的变化。</p>
</div>



<p><span class="zt-ls">（三）组合技能练习</span></p>
<p><span class="zt-cs">全台左推+右攻</span></p>
<p>（1）练习方法</p>
@@ -1229,6 +1249,10 @@
<h4 class="h4-dy3" id="d070"><span class="h4-dy3s">五</span>　训练专项体能</h4>
<p>想要更好地发挥自己的水平，离不开专项体能的支撑。同学们需要不断地训练并提升自己的专项体能，为今后更好地参与乒乓球运动，乃至在职场中展现出更好的身体素质打牢基础。</p>
<p>请同学们登录课程平台进行杠铃箭步蹲、侧抛实心球和绳梯步法训练及横向小滑步、两进两出的专项体能训练。</p>




<h3 class="lefth3" id="c017"><img class="img-gh1" alt="" src="../image/dy3-xm6.jpg"/></h3>
<div class="bk-tyzg">
<p class="bj1-tyzg">体育中国</p>

 src/books/sportsAndHealth/view/front001.vue

@@ -13,7 +13,9 @@
    <div class="page-box" page="2">
      <div v-if="showPageList.indexOf(2) > -1">
        <div class="bodystyle">
          <p>扉页</p>
          <p class="center coverImg">
            <img alt="" class="imz" src="../image/Cover.jpg" />
          </p>
        </div>
      </div>
    </div>
@@ -196,14 +198,10 @@
            <img class="img-0" alt="" src="../image/0010-1.jpg" />
          </p>
          <p>
            此外，本教材还在课程平台www.bnuic.com中设置了丰富的拓展学习内容，供同学们自主学练、组织比赛、评价成效。<a
              id="w1"
            ></a
            ><a href="front005.html#m1"><sup>[1]</sup></a>
            此外，本教材还在课程平台www.bnuic.com中设置了丰富的拓展学习内容，供同学们自主学练、组织比赛、评价成效。
          </p>
          <hr />
          <p class="note">
            <a id="m1"></a><a href="front005.html#w1">[1]</a>
            本教材学习资源具体查找方法为：进入如上网址，依次选择“京师职教→中职→文化基础课→体育与健康（第3版）→教与学资源”，即可查阅教材全部资源。
          </p>
        </div>

 src/books/sportsAndHealth/view/testDynaicTable.vue

New file
@@ -0,0 +1,93 @@
<template>
  <div class="chapter" num="3">
    <div class="page-box" page="33">
      <div v-if="showPageList.indexOf(33) > -1">
        <div class="bodystyle">
          <p>（1）动态伸展</p>
          <p>
            动态伸展是指有节奏且速度略快地多次重复同一动作的伸展方法。动态伸展对提高肌肉的伸展性与收缩性、促进血液循环、提高肌肉的弹性和动作效果等均有良好的作用。动态伸展多用于各种训练前的准备活动，一般每个动作持续1～2秒，重复10～20次，完成1～2组。
          </p>
          <p>（2）静态伸展</p>
          <p>
            静态伸展是指缓慢地将肌肉、韧带等软组织拉长到最大程度后保持一段时间静止不动的伸展方法。使用静态伸展时，注意不要弹震，一般每个动作保持15～30秒，完成1～2组。伸展过程中始终保持自然呼吸而不憋气。
          </p>
          <p><b>2.伸展的训练动作</b></p>
          <p>
            动态伸展和静态伸展均设计了针对上下肢及躯干的训练动作（见表2-1-5）。
          </p>
          <p class="img">表2-1-5 动态伸展和静态伸展训练动作</p>
          <!-- <p class="center">
            <img class="img-a" alt="" src="../image/0061-1.jpg" />
          </p> -->
          <div class="tablePublic leftTable">
            <table>
              <thead>
                <tr>
                  <th style="width: 70px;">训练类型</th>
                  <th style="width: 70px;">训练部位</th>
                  <th style="width: 70px;">动作名称</th>
                  <th>动作示例</th>
                  <th>频次</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td rowspan="8">动态伸展</td>
                  <td rowspan="4">上肢</td>
                </tr>
                <tr>
                  <td>站姿 T 字</td>
                  <td class="gif-Con"><img width="200px" src="../image/gif/T-zi.gif" alt=""></td>
                  <td>
                    <span>次数：20 次 </span><br/><span>组数：2 组</span><br/>间歇：5 秒
                  </td>
                </tr>
                <tr>
                  <td>站姿 W 字</td>
                  <td><img src="" alt=""></td>
                  <td><span>次数：20 次 </span><br/><span>组数：2 组</span><br/>间歇：5 秒</td>
                </tr>
                <tr>
                  <td>交叉摆臂</td>
                  <td><img src="" alt=""></td>
                  <td><span>次数：20 次 </span><br/><span>组数：2 组</span><br/>间歇：5 秒</td>
                </tr>
                <tr>
                  <td rowspan="4">下肢</td>
                </tr>
                <tr>
                  <td>提踵走</td>
                  <td><img src="" alt=""></td>
                  <td><span>次数：20 次 </span><br/><span>组数：2 组（左右两侧各一组）</span><br/>间歇：5 秒</td>
                </tr>
                <tr>
                  <td>脚跟走</td>
                  <td><img src="" alt=""></td>
                  <td><span>次数：20 次 </span><br/><span>组数：2 组（左右两侧各一组）</span><br/>间歇：5 秒</td>
                </tr>
                <tr>
                  <td>行进间股四头肌伸展</td>
                  <td><img src="" alt=""></td>
                  <td><span>次数：20 次 </span><br/><span>组数：2 组（左右两侧各一组）</span><br/>间歇：5 秒</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "testD",
  props: {
    showPageList: {
      type: Array,
    },
    questionData: {
      type: Object,
    },
  },
};
</script>

 src/books/sportsAndHealth/view/testPp.vue

New file
@@ -0,0 +1,1613 @@
<template>
  <div class="chapter" num="4">
    <div class="page-box" page="34">
      <div v-if="showPageList.indexOf(34) > -1">
        <div class="bodystyle">
          <h3 class="lefth3" id="c016">
            <img class="img-gh1" alt="" src="../image/dy3-xm5.jpg" />
          </h3>
          <div class="bk-tyzg">
            <p class="bj1-tyzg">体育中国</p>
            <p class="block">
              自从乒乓球被列为奥运会比赛项目以来，我国获得了全部37枚金牌中的32枚。在2020年东京奥运会中，我国共获得男单、女单、男团、女团4枚金牌。截至2023年5月底，我国乒乓球队有117人获得世界冠军，获得259枚金牌（奥运会金牌32枚、世乒赛金牌156枚、世界杯金牌71枚）。
            </p>
            <p class="block">
              我国乒乓球名将众多，如邓亚萍等已退役的世界乒坛代表人物，又如拿到“大满贯”的现役乒乓球国手马龙、许昕等，均为推动我国乃至世界乒乓球的发展起到重要作用。
            </p>
          </div>
          <!-- <div class="bk-xyx">
            <p class="bj1-xyx">议一议</p>
            <p>1.请同学们搜索“乒乓外交”，并讨论其对我国外交方面的促进作用。</p>
            <p>
              2.请同学们搜索2020年东京奥运会乒乓球女团项目完赛后，我国国家乒乓球队与香港地区乒乓球队颁奖合影的照片，并讨论其积极意义。
            </p>
            <textarea rows="6" v-model="chapter002.textBybItem1"></textarea>
          </div> -->
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">
              · 议一议 ·
              <div class="icon" @click="activityXyx1">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  width="14.243"
                  height="15.417"
                  viewBox="0 0 20.243 18.417"
                >
                  <path
                    class="a"
                    d="M3631.27-14315.585c-.382,0-1.27-.161-1.27-1.655v-15.072a1.7,1.7,0,0,1,1.741-1.681h6.151a.667.667,0,0,1,.12-.009,1.514,1.514,0,0,1,1.248.818c.6.937.934,1.52.935,1.522a.976.976,0,0,0,.712.248h7.925c.014,0,.05,0,.1,0a1.244,1.244,0,0,1,1.3,1.4v12.867a1.655,1.655,0,0,1-.3,1.175,1.227,1.227,0,0,1-.974.38H3631.4A1.177,1.177,0,0,1,3631.27-14315.585Zm2.026-12.5a.693.693,0,0,0-.716.684v.062a.7.7,0,0,0,.716.716h13.674a.693.693,0,0,0,.683-.716v-.062a.684.684,0,0,0-.683-.684Z"
                    transform="translate(-3630 14334.002)"
                  />
                </svg>
              </div>
            </div>
            <br />
            <p class="public-tips">
              1.请同学们搜索“乒乓外交”，并讨论其对我国外交方面的促进作用。
            </p>
            <div class="xyx-text" v-if="chapter002.isShowXyx01">
              <textarea
                rows="8"
                @blur="ChangeBlur"
                v-model="chapter002.textBybItem1"
              ></textarea>
            </div>
            <p class="public-tips">
              2.请同学们搜索2020年东京奥运会乒乓球女团项目完赛后，我国国家乒乓球队与香港地区乒乓球队颁奖合影的照片，并讨论其积极意义。
            </p>
            <div class="xyx-text" v-if="chapter002.isShowXyx01">
              <textarea
                rows="8"
                @blur="ChangeBlur"
                v-model="chapter002.textBybItem2"
              ></textarea>
            </div>
          </div>
          <div class="bk-dy3xxmb">
            <p class="bj1-dy3xxmb">学习目标</p>
            <p class="block">
              1.了解乒乓球运动的特点、价值、技术动作及基础战术配合的相关基础知识。
            </p>
            <p class="block">
              2.掌握乒乓球的正反手攻球、搓球和弧圈球技术，左推右攻、推挡侧身攻的组合技能，以及发球抢攻、接发球抢攻、对攻、搓攻等战术。
            </p>
            <p class="block">
              3.培养良好的体育锻炼习惯、遵守体育道德，积极参加班级和学校组织的乒乓球活动、比赛，在学练和比赛中培养遵纪守法、团结互助、积极乐观、勇于拼搏的品格。
            </p>
          </div>
          <h4 class="h4-dy3" id="d066">
            <span class="h4-dy3s">一</span>　了解乒乓球运动
          </h4>
          <div class="pdf-text">
            <div class="pdf-con">
              <div class="pdf-view">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg>
                </span>
                <span @click="toUrl(1)">乒乓球的常用术语（一）.pdf</span>
              </div>
              <div class="pdf-view">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg>
                </span>
                <span @click="toUrl(2)">乒乓球的常用术语（二）.pdf</span>
              </div>
            </div>
            <p>
              乒乓球运动是一项由两名或四名运动员在乒乓球桌上进行隔网攻守的运动，在世界上许多地方流行。乒乓球运动1900年起源于英国，20世纪初在欧洲和亚洲蓬勃开展起来。乒乓球运动易于开展，打法多样，球路变化丰富，技术动作要求协调、灵敏、精确，观赏性强。乒乓球运动能有效发展力量、速度、耐力、灵敏性等身体素质，同时也能锻炼和培养勇敢、顽强、机智、果断等心理品质。乒乓球运动对今后从事需久坐、久站的职业，尤其是需要进行精细化操作的职业人群身体状况的改善有积极的作用。“乒乓精神”所蕴含的技术创新和精益求精也是同学们应该学习和践行的职业精神。乒乓球运动在国内外广泛开展，乒乓球世界杯、世锦赛与奥运会并称世界乒乓球三大赛事。
            </p>
          </div>
        </div>
      </div>
    </div>
    <div class="page-box" page="35">
      <div v-if="showPageList.indexOf(35) > -1">
        <div class="bodystyle">
          <h4 class="h4-dy3" id="d067">
            <span class="h4-dy3s">二</span>　学练乒乓球技能
          </h4>
          <h5 id="e100"><span class="bj1-mk">模块一</span></h5>
          <p>
            本模块设置了乒乓球运动中较为基础的技战术内容。其中，单项技术学练包括握拍方法与核心技术、反手推挡、正手攻球，以及课程平台中的平击发球；基本战术学练包括发平击球抢攻，以及课程平台中的接平击球抢攻；组合技能练习设置的是1/2
            左推+右攻，以及课程平台中的推挡+侧身攻。同学们学练本模块的内容，能够提高基本的技战术水平，为参与本模块设置的比赛提供保障，为后续模块的学练奠定基础。
          </p>
          <div class="pdf-tips-con">
            <p class="zt-ls">（一）单项技术学练</p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg>
                </span>
                <span @click="toUrl(3)"
                  >3 模块一（一）单项技术学练 平击发球.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">1.握拍方法与核心技术</span></p>
          <p>乒乓球的握拍方法分为直板和横板。</p>
          <p>（1）动作要领</p>
          <p>
            乒乓球核心技术的支撑动作规格是前臂带动手腕内旋90°，形成一个与端线平行的平面，用于反手支撑技术；前臂带动手腕外展90°，形成一个与端线平行的平面，用于正手支撑技术。乒乓球核心技术的卷带动作是在完成对反手球进行支撑的基础上，前臂带动手腕由内旋变为外展，完成反手击球动作；在完成对正手球进行支撑的基础上，前臂带动手腕由外展变为内旋，完成反手击球动作；击球点在身体的侧前方，发力阶段在卷带期。
          </p>
          <p class="center openImgBox">
            <img class="img-c" alt="" src="../image/0119-1.jpg" />
          </p>
          <p class="img">图3-5-1 直板握拍和横板握拍</p>
          <p>（2）学练建议</p>
          <p>①原地颠球练习，要求端平球拍。</p>
          <p>②行进间颠球练习，要求身体重心保持水平状态。</p>
          <p style="margin-bottom: 30px">
            ③对墙练习，先进行正反手的支撑练习，同时结合单步和并步练习。
          </p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>
              乒乓球击球过程的支撑和卷带是一个连贯的动作：先进行支撑练习，再进行卷带练习；动作要先慢后快，弧线要先高后低；先进行单个动作练习，再进行连贯动作练习。
            </p>
          </div>
          <p>
            ④拓展练习：在熟练完成正反手支撑练习的基础上完成支撑卷带的练习，同时配合脚步动作；进行球台的正反手支撑练习；在支撑熟练的基础上，进行球台的正反手支撑卷带练习。
          </p>
          <p><span class="zt-cs">2.反手推挡</span></p>
          <p>（1）动作要领</p>
          <p>
            击球前，左脚稍前站立，身体离台40～50厘米；通过脚步移动来到球落点的侧
          </p>
        </div>
      </div>
    </div>
    <div class="page-box" page="36">
      <div v-if="showPageList.indexOf(36) > -1">
        <div class="bodystyle">
          <p style="text-indent: 0">
            前方，前臂内旋将球拍后引至身体左侧稍后；在上升期击球的中上部；击球后前臂向上方外转90°，然后迅速还原成击球前的准备姿势。
          </p>
          <p>（2）学练建议</p>
          <p>①在练习过程中先进行颠球练习，完成50次颠球后进行对墙练习。</p>
          <p>②上台练习，完成支撑动作。</p>
          <p>③在支撑熟练的基础上完成乒乓球卷带动作。</p>
          <p>
            ④拓展练习：通过不断增加推挡的次数巩固技术，实现从量变到质变的目标。
          </p>
          <!-- <p class="center">
            <img class="img-c" alt="" src="../image/0120-1.jpg" />
          </p> -->
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/352-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/352-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/352-3.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
          <p class="img">图3-5-2 反手推挡</p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.乒乓球的推挡练习要严格按照技术路线进行。</p>
            <p>
              2.推挡技术的学习先慢后快，先高弧线支撑，然后按弧线的方式进行练习。
            </p>
            <p>3.学推挡技术前，要先进行单球练习，然后进行连贯动作的练习。</p>
          </div>
          <p><span class="zt-cs">3.正手攻球</span></p>
          <p>
            攻球技术是乒乓球技术中重要的得分技术之一，它在击球方式上以撞击为主，因此具有击球速度快、动作小、进攻性强的特点。攻球技术可分为正手攻球和反手攻球，乒乓球技术中的每一部分又进一步细化为快攻、快点、快拉、快带、突击、扣杀、挑打、滑板等技术。每种技术有着不同的特点和战术目的，要掌握全面的攻球技术，就必须掌握好基本的攻球技术。
          </p>
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/353-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/353-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/353-3.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/353-4.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
          <p class="img">图3-5-3 正手攻球</p>
          <p>（1）动作要领</p>
          <p>
            击球前，左脚稍前站立，身体离台约50厘米；判断来球位置，前臂外展将球拍后引至身体右侧稍后；在球的上升期或高点期击球的中上部；击球点在正手位身体侧前方；击球后，迅速还原成击球前的准备姿势。
          </p>
          <p>（2）学练建议</p>
          <p>①在练习过程中先进行颠球练习，完成50次颠球后进行对墙练习。</p>
          <p>②上台练习，完成支撑动作。</p>
          <p>③在支撑熟练的基础上完成乒乓球卷带动作。</p>
          <p>
            ④拓展练习：通过减慢正手攻球速度巩固技术，通过加快击球速度提高技术质量。
          </p>
        </div>
      </div>
    </div>
    <div class="page-box" page="37">
      <div v-if="showPageList.indexOf(37) > -1">
        <div class="bodystyle">
          <div class="pdf-tips-con">
            <p class="zt-ls">（二）基本战术学练</p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(4)"
                  >4 模块一（二）基本战术学练接平击球抢攻.pdf</span
                >
              </div>
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(5)"
                  >5 模块一（三）组合技能练习 推挡+侧身攻.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">发平击球抢攻</span></p>
          <p>（1）战术方法</p>
          <p>①先要树立发球抢攻的战术意识。</p>
          <p>②正手平击发球后通过脚步移动保证击球点在本方正<br />手的侧前方。</p>
          <p>③在抢攻的过程中保持技术的连贯性。</p>
          <p>④发力阶段在击球的卷带期。</p>
          <p>⑤注意动作的还原。</p>
          <p>（2）学练建议</p>
          <p>①先进行徒手的发抢练习。</p>
          <p>②进行合法发球和技术衔接练习。</p>
          <p>③先进行分解动作练习，再进行完整战术练习。</p>
          <p>④拓展练习：通过分解练习提高抢攻的质量，通过实践进行战术应用。</p>
          <p>&nbsp;</p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.发球质量是抢攻的基础。</p>
            <p>2.发球要合乎规定。</p>
            <p>3.通过脚步移动寻找最佳击球点，能有效地提高技术质量。</p>
            <p>4.注意发球线路的变化。</p>
          </div>
          <p><span class="zt-ls">（三）组合技能练习</span></p>
          <p><span class="zt-cs">1/2左推+右攻</span></p>
          <p>（1）练习方法</p>
          <p>
            ①准备动作：左脚在前，右脚在后，两脚间距比肩稍宽，低头含胸，两眼平视，手腕内旋，球拍在反手位的侧前方。
          </p>
          <p>
            ②动作要领：站在左半台先进行推直线练习，然后通过步法移动到中线附近，同时将执拍手移到正手位，调整重心到右脚，做好正手攻斜线的准备。在击球前，手腕外展，在击球过程中保证击球点在身体的侧前方，同时前臂带动手腕由外展变为内旋，挥拍至左眼上方，然后通过单步移动至反手位，回到准备动作阶段。
          </p>
          <p>（2）练习要求</p>
          <p>
            站在球台的左半台，离球台40～50厘米。推挡为直线，正手攻球为斜线，落点位置在左半台的边线位置。通过步法移动保证击球点在身体的侧前方。
          </p>
          <h5 id="e101"><span class="bj1-mk">模块二</span></h5>
          <p>
            本模块在上一模块学练的基础上，进阶性地设置了乒乓球运动新的学练内容。其中，单项技术学练包括攻球、推挡和快搓，慢搓，以及课程平台中的正手快带、转与不转球发球；
          </p>
        </div>
      </div>
    </div>
    <div class="page-box" page="38">
      <div v-if="showPageList.indexOf(38) > -1">
        <div class="bodystyle">
          <p>
            基本战术学练包括对攻战术，以及课程平台中的发转与不转球抢攻；组合技能练习设置的是推挡+侧身攻，以及课程平台中的左推+右攻。同学们学练本模块的内容，在掌握一定难度技战术和组合技能的基础上，能够参与本模块设置的比赛活动，并为难度更高的下一模块的学练做好铺垫。
          </p>
          <div class="pdf-tips-con">
            <p><span class="zt-ls">（一）单项技术学练</span></p>
            <div class="pdf-wall" style="top: 60px">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(6)"
                  >6 模块二（一）单项技术学练 正手快带.pdf</span
                >
              </div>
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(7)"
                  >7 模块二（一）单项技术学练 转与不转球发球.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">1.攻球、推挡和快搓</span></p>
          <p>（1）动作要领</p>
          <p>
            攻球、推挡、快搓技术按照核心技术进行分析，都是由支撑和卷带两个连贯的动作组成的。
          </p>
          <p>
            ①正手攻球：挥拍手由前臂带动手腕外展90°形成支撑动作，在击球的过程中向侧前方挥拍，手腕由外展变成内旋90°完成卷带动作。
          </p>
          <p>
            ②推挡：挥拍手由前臂带动手腕内旋90°形成支撑动作，在击球的过程中向侧前方挥拍，手腕由内旋变成外展90°完成卷带动作。
          </p>
          <p>
            ③快搓：挥拍手由前臂带动手腕内旋90°形成支撑动作，在击球的过程中向侧下方挥拍，手腕由内旋变成外展90°完成卷带动作。
          </p>
          <!-- <p class="center">
            <img class="img-a" alt="" src="../image/0122-1.jpg" />
          </p> -->
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/354-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/354-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/354-3.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/354-4.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
            <p class="img">图3-5-4 快搓</p>
          </div>
          <br />
          <p>（2）学练建议</p>
          <p>①学习正反手的支撑动作。</p>
          <p>②正反手支撑动作完成后，再完成侧前方卷带动作。</p>
          <p>③正反手支撑动作完成后，再完成侧下方卷带动作。</p>
          <p>④拓展练习：通过正反手的转换练习体验核心技术的区别与联系。</p>
          <p style="margin-bottom: 30px"><span class="zt-cs">2.慢搓</span></p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.支撑动作一定要平。</p>
            <p>2.先高弧线支撑，熟练后再逐步降低弧线。</p>
            <p>3.支撑熟练后进行支撑卷带练习。</p>
            <p>4.配合重心的转移和脚步的移动保持击球点在身体的侧前方。</p>
          </div>
          <!-- <p class="center">
            <img class="img-b" alt="" src="../image/0122-2.jpg" />
          </p> -->
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/355-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/355-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/355-3.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
          <p class="img">图3-5-5 慢搓</p>
          <p>
            搓球是近台还击下旋球的一种基本技术，可用它为拉弧圈球创造条件。它与攻球技术结合起来可以形成搓攻战术。搓球在接发球时可以有效地过渡，为自己下一板创造进攻机会。
          </p>
        </div>
      </div>
    </div>
    <div class="page-box" page="39">
      <div v-if="showPageList.indexOf(39) > -1">
        <div class="bodystyle">
          <p>（1）动作要领</p>
          <p>
            慢搓要求右脚在前或两脚平行站立，身体离台40～50厘米。手臂外旋使拍面角度后仰，前臂向左上方引拍至胸前，横握拍手腕适当外展，直握拍手腕作屈，拍头指向斜上方。当来球跳至下降前期，前臂带动手腕加速向右前下方。用力摩擦球拍面后，仰击球的中下偏外侧的部位。击球后，前臂顺势前送，并注意还原。
          </p>
          <p>（2）学练建议</p>
          <p>①先进行颠球练习，完成50次颠球后进行对墙练习。</p>
          <p>②上台练习，先完成支撑动作。</p>
          <p>③在支撑熟练的基础上完成侧下方卷带动作。</p>
          <p style="margin-bottom: 30px">
            ④拓展练习：配合步法进行连续的搓球练习，并结合比赛运用。
          </p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.乒乓球的搓球练习要严格按照技术路线进行。</p>
            <p>
              2.先学习慢搓，再学习快搓，先高弧线支撑，然后按弧线的方式进行练习。
            </p>
            <p>3.先进行单球练习，然后进行连贯动作的练习。</p>
            <p>4.一定在球的下降期击球。</p>
            <p>5.正反手慢搓技术动作相同，但方向相反。</p>
          </div>
          <p><span class="zt-ls">（二）基本战术学练</span></p>
          <p><span class="zt-cs">对攻战术</span></p>
          <p>（1）战术方法</p>
          <p>
            先练压反手，伺机抢攻。当对方反手较弱或进攻能力不强时（如直拍），可用推挡、反手快拨或弧圈球连续压对方反手，伺机压一板中路，加大角度或力量，迫使对方回球质量不高后，再突然用正手进攻。第二压反手变正手，如果对方侧身的意识和能力很强，这时再连压反手就可能适得其反，而要主动采取伺机变正手的方式，既可偷袭对方正手位空当，又可牵制对方的侧身抢攻，一举两得。如果自己的反手不如对方而正手进攻能力较强，可主动变线形成正手对攻。
          </p>
          <p>（2）学练建议</p>
          <p>①进行徒手的对攻练习。</p>
          <p>②进行合法发球和技术衔接练习。</p>
          <p>③先进行分解动作练习，再进行完整战术练习。</p>
          <p style="margin-bottom: 30px">
            ④拓展练习：通过不断练习提高对攻的战术水平和质量，通过小型对抗赛来巩固对攻技术。
          </p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.技术质量是战术的基础。</p>
            <p>2.战术意图执行要坚定。</p>
            <p>3.通过步法移动寻找最佳击球点，能有效地提高技术质量。</p>
            <p>4.注意发球线路的变化。</p>
          </div>
          <!-- <p><span class="zt-ls">（三）组合技能练习</span></p> -->
          <div class="pdf-tips-con">
            <p class="zt-ls">（三）组合技能练习</p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(8)"
                  >8 模块二（二）基本战术学练 发转与不转球抢攻.pdf</span
                >
              </div>
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(9)"
                  >9 模块二（三）组合技能练习 左推+右攻.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">推挡+侧身攻</span></p>
          <p>（1）练习方法</p>
          <p>
            ①准备动作：左脚在前，右脚在后，两脚间距比肩<br />稍宽，低头含胸，两眼平视，手腕内旋，球拍在反手位<br />的侧前方。
          </p>
        </div>
      </div>
    </div>
    <div class="page-box" page="40">
      <div v-if="showPageList.indexOf(40) > -1">
        <div class="bodystyle">
          <p>
            ②动作要领：站在左半台先进行推斜线练习，然后通过步法移动到左侧边线外，同时将执拍手移到正手位的侧身位，调整重心到右脚，做好正手攻斜线的准备。在击球前，手腕外展；击球过程中，保证击球点在身体的侧前方，同时前臂带动手腕由外展变为内旋，挥拍至左眼上方，然后通过跳步移动至反手位，回到准备动作阶段。
          </p>
          <p>（2）练习要求</p>
          <p>
            站在左半台边，离球台40～50厘米。推挡和侧身攻为斜线，落点在球台的中线或左侧边位置。通过步法移动完成技术组合动作。
          </p>
          <h5 id="e102"><span class="bj1-mk">模块三</span></h5>
          <p>
            本模块难度有所增加，在单项技术学练方面设置了正手弧圈球、正手发左侧上（下）旋球，以及课程平台中的弧圈球、快搓、反手快拨；基本战术学练设置了侧身正手发左侧上下旋后抢攻，以及课程平台中的搓攻战术；组合技能练习设置了全台左推+右攻，以及课程平台中的推挡+侧身攻。本模块的学习有助于同学们参与更高要求的乒乓球比赛提供重要保障。
          </p>
          <!-- <p><span class="zt-ls">（一）单项技术学练</span></p> -->
          <div class="pdf-tips-con">
            <p><span class="zt-ls">（一）单项技术学练</span></p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(10)"
                  >10 模块三（一）单项技术学练 弧圈球.pdf</span
                >
              </div>
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(11)"
                  >11 模块三（一）单项技术学练 快搓.pdf</span
                >
              </div>
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(12)"
                  >12 模块三（一）单项技术学练 反手快拨.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">1.正手弧圈球</span></p>
          <p>（1）动作要领</p>
          <p>
            击球前，左脚稍前站立，身体离台50～60厘米；以右手为例，引拍向右后方，球拍与来球同高或稍低于来球；在球的上升期或高点期击球的中上部，击球的瞬间，应将向前的撞击与摩擦球动作融为一体；在球的上升期和高点期击球，同时迅速还原。
          </p>
          <!-- <p class="center">
            <img class="img-a" alt="" src="../image/0124-1.jpg" />
          </p> -->
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/356-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/356-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/356-3.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/356-4.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/356-5.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
            <p class="img">图3-5-6 正手弧圈球</p>
          </div>
          <br />
          <p>（2）学练建议</p>
          <p>①完成50次对墙练习。</p>
          <p>②完成单个弧圈球技术练习。</p>
          <p>③在支撑熟练的基础上完成连续的弧圈球技术练习。</p>
          <p>④拓展练习：配合多球来巩固技术动作。</p>
        </div>
      </div>
    </div>
    <div class="page-box" page="41">
      <div v-if="showPageList.indexOf(41) > -1">
        <div class="bodystyle">
          <p><span class="zt-cs">2.正手发左侧上（下）旋球</span></p>
          <p>（1）动作要领</p>
          <p>
            正手发左侧上（下）旋球时，左脚在前，右脚在后，身体侧向球台，身体重心下降。左手将球向上抛起，同时右臂向右后上方引拍，握拍手腕外展，腰部略向右转动。当球下降至接近网高时，前臂加速向左前方挥摆，触球时手臂、手腕发力，直握拍手腕内旋，横握拍手腕内收，腰部配合向左转。发侧上旋球时，拍面略微立起，击球的中部向左侧上方摩擦；发侧下旋球时，拍面略后仰，击球的中下部向左侧下方向摩擦。随势挥拍，迅速还原。
          </p>
          <!-- <p class="center">
            <img class="img-a" alt="" src="../image/0125-1.jpg" />
          </p> -->
          <div class="imgBox-003 openImgBox">
            <div class="swiper-container swiper-img">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/357-1.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/357-2.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/357-3.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/357-4.png" />
                  </div>
                </div>
                <div class="swiper-slide">
                  <div class="imgBox" style="width: 100%; height: 100%">
                    <img src="../image/357-5.png" />
                  </div>
                </div>
              </div>
              <div class="swiper-button-next"></div>
              <div class="swiper-button-prev"></div>
            </div>
          </div>
          <p class="img">图3-5-7 正手发左侧上（下）旋球</p>
          <p>（2）学练建议</p>
          <p>①学习正确的抛球动作。</p>
          <p>②进行无球徒手练习。</p>
          <p>③进行正手发左侧上（下）旋球的练习。</p>
          <p style="margin-bottom: 30px">
            ④拓展练习：通过练习不断提高发球的速度和力量，通过班级对抗赛来巩固发球技术。
          </p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.学习正手发球时先要进行合法发球练习。</p>
            <p>2.正手发左侧上（下）旋球要与正手攻球进行有效的衔接。</p>
            <p>
              3.正手发左侧上（下）旋球要求在动作相似的前提下发出旋转球和不转球。
            </p>
            <p>4.正反的发球动作相同，但方向相反。</p>
          </div>
          <!-- <p><span class="zt-ls">（二）基本战术学练</span></p> -->
          <div class="pdf-tips-con">
            <p><span class="zt-ls">（二）基本战术学练</span></p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(13)"
                  >13 模块三（二）基本战术学练 搓攻战术.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">侧身正手发左侧上下旋后抢攻</span></p>
          <p>（1）战术方法</p>
          <p>
            发左侧旋球至对方反手位、反手底线大角中路偏反手底线或追身以及正手小三角短球，再配合一板直线急长球。对方侧身轻拉至反手，可用推挡加力或快压直线，也可用侧身攻（以速度为主）直线，迫使对方扑救正手位，再寻机发力；如对方用反手推拨或轻挂至反手，可压制其中路追身；如对方直接回至正手位，可用正手快带线到对方正手大角，然后等正手位做连续进攻的准备。
          </p>
          <p>（2）学练建议</p>
          <p>①先进行徒手的发抢练习。</p>
          <p>②进行合法发球和技术衔接练习。</p>
          <p>③先进行分解动作练习，再进行完整战术练习。</p>
          <p style="margin-bottom: 30px">
            拓展练习：通过不断练习提高发球抢攻的战术水平和抢攻的质量。
          </p>
          <div class="bk-xyx">
            <div class="bj1-xyx publicxbc">注意事项</div>
            <p>1.发球质量是抢攻的基础。</p>
            <p>2.发球要合乎规定。</p>
            <p>3.通过步法移动，寻找最佳击球点，能有效地提高技术质量。</p>
            <p>4.注意发球线路的变化。</p>
          </div>
        </div>
      </div>
    </div>
    <div class="page-box" page="42">
      <div v-if="showPageList.indexOf(42) > -1">
        <div class="bodystyle">
          <!-- <p><span class="zt-ls">（三）组合技能练习</span></p> -->
          <div class="pdf-tips-con">
            <p><span class="zt-ls">（三）组合技能练习</span></p>
            <div class="pdf-wall">
              <div class="pdf-item">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg> </span
                ><span @click="toUrl(14)"
                  >14 模块三（三）组合技能练习 推挡+侧身攻.pdf</span
                >
              </div>
            </div>
          </div>
          <p><span class="zt-cs">全台左推+右攻</span></p>
          <p>（1）练习方法</p>
          <p>
            ①准备动作：左脚在前，右脚在后，两脚间距比肩稍宽，低头含胸，两眼平视，手腕内旋，球拍在反手位的侧前方。
          </p>
          <p>
            ②动作要领：在左半台先进行推直线练习，然后通过步法移动到正手位，调整重心到右脚，做好正手攻斜线的准备。在击球前，手腕外展；在击球过程中，保证击球点在身体的侧前方。同时，前臂带动手腕由外展变为内旋，挥拍至左眼上方，然后通过单步移动至反手位，回到准备动作阶段。
          </p>
          <p>（2）练习要求</p>
          <p>
            站在球台的左边，离球台40～50厘米。推挡为直线，正手攻球为斜线，落点位置在左半台的边线位置。要通过步法移动保证击球点在身体的侧前方。
          </p>
          <h4 class="h4-dy3" id="d068">
            <span class="h4-dy3s">三</span>　参与乒乓球比赛
          </h4>
          <p>
            请同学们登录课程平台，了解自己感兴趣的比赛活动的方法、要求和注意事项等，自行组织比赛，在竞赛中巩固学练成果。
          </p>

          <p>
            模块一比赛有：颠球比赛、推挡比赛、正手攻球比赛、11分教学比赛（一）。
          </p>
          <p>模块二比赛有：快拨比赛、快攻比赛、11分教学比赛（二）。</p>
          <p>模块三比赛有：搓球比赛、弧圈球比赛、11分教学比赛（三）。</p>

          <h4 class="h4-dy3" id="d069">
            <span class="h4-dy3s">四</span>　实施自主评价
          </h4>
          <p>
            在前面学、练、赛的过程中，同学们对自己和身边同学的学习效果有了初步的评判，那么如何系统地评价自己对乒乓球运动技战术的掌握程度和整个运动的理解程度呢？请同学们登录课程平台，进行系统、全面的自主评价。
          </p>
          <h4 class="h4-dy3" id="d070">
            <span class="h4-dy3s">五</span>　训练专项体能
          </h4>
          <p>
            想要更好地发挥自己的水平，离不开专项体能的支撑。同学们需要不断地训练并提升自己的专项体能，为今后更好地参与乒乓球运动，乃至在职场中展现出更好的身体素质打牢基础。
          </p>
          <p style="margin-bottom: 30px">
            请同学们登录课程平台进行杠铃箭步蹲、侧抛实心球和绳梯步法训练及横向小滑步、两进两出的专项体能训练。
          </p>
          <div class="pdf-text">
            <div class="pdf-con pdf-con-15">
              <div class="pdf-view">
                <span>
                  <svg
                    t="1717640665152"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="11009"
                    width="25.098"
                    height="24.098"
                  >
                    <path
                      d="M896.152 336.108l0 576.229c0 26.511-21.508 48.019-48.018 48.019L175.866 960.356c-26.511 0-48.019-21.508-48.019-48.019L127.847 112.019c0-26.511 21.508-48.019 48.019-48.019l448.179 0c26.512 0 63.527 15.508 82.031 34.013l156.064 156.064C880.645 272.582 896.152 309.597 896.152 336.108zM832.127 384.127 624.045 384.127c-26.512 0-48.02-21.508-48.02-48.019L576.025 128.025 191.873 128.025l0 768.306 640.254 0L832.127 384.127zM335.93 448.153l352.14 0c9.004 0 16.006 7.003 16.006 16.006l0 32.013c0 9.003-7.002 16.007-16.006 16.007L335.93 512.179c-9.003 0-16.006-7.003-16.006-16.007l0-32.013C319.924 455.156 326.927 448.153 335.93 448.153zM704.076 592.21l0 32.013c0 9.004-7.002 16.007-16.006 16.007L335.93 640.23c-9.003 0-16.006-7.003-16.006-16.007L319.924 592.21c0-9.003 7.003-16.006 16.006-16.006l352.14 0C697.074 576.204 704.076 583.207 704.076 592.21zM704.076 720.262l0 32.013c0 9.003-7.002 16.006-16.006 16.006L335.93 768.281c-9.003 0-16.006-7.003-16.006-16.006l0-32.013c0-9.004 7.003-16.007 16.006-16.007l352.14 0C697.074 704.255 704.076 711.258 704.076 720.262zM640.051 320.102l188.076 0c-3.002-8.505-7.502-17.009-11.002-20.511L660.563 143.029c-3.502-3.501-12.006-8-20.512-11.003L640.051 320.102z"
                      p-id="11010"
                    ></path>
                  </svg>
                </span>
                <span @click="toUrl(15)">15 拓展资料：乒乓球裁判法.pdf</span>
              </div>
            </div>
          </div>
          <br>
          <div class="bk-xyx" style="padding: 2px 0">
            <div class="bj1-xyx publicxbc">
              · 视频库集 ·
              <div class="icon" @click="activityXyx2">
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  xmlns:xlink="http://www.w3.org/1999/xlink"
                  width="16.863"
                  height="13.817"
                  viewBox="0 0 19.863 13.817"
                >
                  <g transform="translate(-40.961 -184.321)">
                    <path
                      class="a"
                      d="M4.647,1.4a1,1,0,0,1,1.707,0L10.07,7.479A1,1,0,0,1,9.217,9H1.783A1,1,0,0,1,.93,7.479Z"
                      transform="translate(51.824 196.82) rotate(-90)"
                    />
                    <path
                      class="b"
                      d="M3322.914-15094.863h-10.363a2.593,2.593,0,0,1-2.59-2.59v-8.638a2.593,2.593,0,0,1,2.59-2.59h10.363a2.6,2.6,0,0,1,2.594,2.59v1.729c.013.027,0,3.6,0,5.141v1.769A2.6,2.6,0,0,1,3322.914-15094.863Zm-6.9-9.933a.862.862,0,0,0-.755.468.947.947,0,0,0-.114.455v4.2a.9.9,0,0,0,.868.922.848.848,0,0,0,.432-.121l3.45-2.12a.956.956,0,0,0,.315-1.259.874.874,0,0,0-.322-.341l-3.451-2.086A.813.813,0,0,0,3316.01-15104.8Z"
                      transform="translate(-3269 15293.001)"
                    />
                  </g>
                </svg>
              </div>
            </div>
            <br />
            <p class="public-tips">项目五 · 视频库集</p>
            <div class="parentVideo" v-if="isShowXyx02">
              <div class="videoItem" v-if="chapter002.videoShow1">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v1"
                ></video>
                <span>{{ chapter002.videoMd5.v1.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow1">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v2"
                ></video>
                <span>{{ chapter002.videoMd5.v2.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow1">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v3"
                ></video>
                <span>{{ chapter002.videoMd5.v3.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow1">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v4"
                ></video>
                <span>{{ chapter002.videoMd5.v4.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow1">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v5"
                ></video>
                <span>{{ chapter002.videoMd5.v5.name }}</span>
              </div>

              <div class="videoItem" v-if="chapter002.videoShow2">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v6"
                ></video>
                <span>{{ chapter002.videoMd5.v6.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow2">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v7"
                ></video>
                <span>{{ chapter002.videoMd5.v7.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow2">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v8"
                ></video>
                <span>{{ chapter002.videoMd5.v8.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow2">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v9"
                ></video>
                <span>{{ chapter002.videoMd5.v9.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow2">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v10"
                ></video>
                <span>{{ chapter002.videoMd5.v10.name }}</span>
              </div>

              <div class="videoItem" v-if="chapter002.videoShow3">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v11"
                ></video>
                <span>{{ chapter002.videoMd5.v11.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow3">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v12"
                ></video>
                <span>{{ chapter002.videoMd5.v12.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow3">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v13"
                ></video>
                <span>{{ chapter002.videoMd5.v13.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow3">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v14"
                ></video>
                <span>{{ chapter002.videoMd5.v14.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow3">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v15"
                ></video>
                <span>{{ chapter002.videoMd5.v15.name }}</span>
              </div>

              <div class="videoItem" v-if="chapter002.videoShow4">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v16"
                ></video>
                <span>{{ chapter002.videoMd5.v16.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow4">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v17"
                ></video>
                <span>{{ chapter002.videoMd5.v17.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow4">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v18"
                ></video>
                <span>{{ chapter002.videoMd5.v18.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow4">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v19"
                ></video>
                <span>{{ chapter002.videoMd5.v19.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow4">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v20"
                ></video>
                <span>{{ chapter002.videoMd5.v20.name }}</span>
              </div>

              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v21"
                ></video>
                <span>{{ chapter002.videoMd5.v21.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v22"
                ></video>
                <span>{{ chapter002.videoMd5.v22.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v23"
                ></video>
                <span>{{ chapter002.videoMd5.v23.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v24"
                ></video>
                <span>{{ chapter002.videoMd5.v24.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v25"
                ></video>
                <span>{{ chapter002.videoMd5.v25.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v26"
                ></video>
                <span>{{ chapter002.videoMd5.v26.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v27"
                ></video>
                <span>{{ chapter002.videoMd5.v27.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v28"
                ></video>
                <span>{{ chapter002.videoMd5.v28.name }}</span>
              </div>
              <div class="videoItem" v-if="chapter002.videoShow5">
                <video
                  webkit-playsinline="true"
                  x-webkit-airplay="true"
                  playsinline="true"
                  x5-video-orientation="h5"
                  x5-video-player-fullscreen="true"
                  x5-playsinline=""
                  controls
                  class="video-border w100"
                  :src="chapter002.videoUrl.v29"
                ></video>
                <span>{{ chapter002.videoMd5.v29.name }}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { getResourcePath } from "@/assets/methods/resources";
export default {
  name: "testPp",
  props: {
    showPageList: {
      type: Array,
    },
    questionData: {
      type: Object,
    },
    isSearch: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      isShowXyx02: false,
      pingpang: require("../image/pdf.png"),
      chapter002: {
        isShowXyx01: true,
        textBybItem1: "",
        pdfMd5: {
          1: "54741d14a21eb47b2ed06a2231271cd5",
          2: "1b7ecc924bfab900ec10f0ed4bb2466b",
          3: "f1597b91fb3110eb6fd59c84f5ddbfd1",
          4: "515f3dd2554dbdea779c59800a8da6b2",
          5: "b32afdfb8555ad8db1aa1fd95750369f",
          6: "57481cd4e7e7ce535eb6585d375e317e",
          7: "878a8bbb91f093107cae210ade9a387e",
          8: "e242f94d2bdc54de7b5340d452256515",
          9: "1ce6dc7953b1783de746e0de672ffbe4",
          10: "030b943ad33a4c0f31524f0f1ec9c14f",
          11: "2a458d11dc021318e2d3aa4f92cf3e36",
          12: "81957321d71fd270f67fe74f7ef2b9e8",
          13: "5f675eff789c96ce8a6cf80679c8a992",
          14: "02236dec8a8e87176b1df2435b82fb87",
          15: "fa38047ab9eed59f3296940778cc6cfd",
        },
        videoMd5: {
          v1: { md5: "bfbb956d884e0a11ba6368846176657d", name: "1核心技术" },
          v2: {
            md5: "07cd17a31b6648cfce8065144f2cf80a",
            name: "2正反手支撑卷带",
          },
          v3: {
            md5: "8dea53331d520d7b39bc2a393bd1e6b6",
            name: "3推挡和正手攻球",
          },
          v4: { md5: "3eba3ce508187071cfd72142f283766b", name: "4反手推挡" },
          v5: { name: "5平击发球", md5: "13a7382a21136ba5d284ab03bc7ad970" },
          v6: { name: "6接发球抢攻", md5: "d97edccc25fc22dfe445b429e45c8733" },
          v7: { name: "7二分之一", md5: "d75d475ff7dbb48c34ff48a3a1d82613" },
          v8: { name: "8推挡侧身攻", md5: "8a8c0d8b3853b29f339816659abd66aa" },
          v9: { name: "9跳绳", md5: "9c67757467a53feb2c0a0e27ec8022a1" },
          v10: { name: "10单步练习", md5: "c0f3327cad5f22ca90bcbaa86283b9d2" },
          v11: { name: "11并步滑步", md5: "948244798e8b9230372d8958aff1025a" },
          v12: {
            name: "12攻球、推挡和搓球",
            md5: "031ecadb43d24a19f1c127a12d616d04",
          },
          v13: { name: "13慢搓", md5: "f4950882dc39c94cf7142c7a6db1dfb4" },
          v14: { name: "14正手快带", md5: "8d4f45af584a9380f2cc7e89669f9cb4" },
          v15: {
            name: "15转与不旋球发球",
            md5: "9bffeb833ebce386d0a501ceffa0da5b",
          },
          v16: {
            name: "16发旋与不转球抢攻",
            md5: "6eee3474169e5115a34f97d1e88e5a37",
          },
          v17: { name: "17对攻战术", md5: "73aef026f69c517a6960391e988ded40" },
          v18: { name: "18三分之二", md5: "62cf2e9ff7b31e506b3a916ea322a8bf" },
          v19: { name: "19多球练习", md5: "6f1d03723c1c64c3761c4274e7f5ebe6" },
          v20: {
            name: "20交叉步练习",
            md5: "c1ed6663e29bdca2201cbb8b7887e9d8",
          },
          v21: {
            name: "21弧圈球与攻球和下旋球",
            md5: "95e61a853095c7a9c910f172f282096a",
          },
          v22: { name: "22快搓", md5: "e116cf8c12a0db61e03c6c0628f56942" },
          v23: { name: "23反手快拨", md5: "c84e3d255f83005322d0c24c043fea2a" },
          v24: {
            name: "24正手弧圈球",
            md5: "09ba85a89ce6e025aacfff63b24ef652",
          },
          v25: {
            name: "25正手发左侧上(下)旋球",
            md5: "595aff1cc303fb4b12dfbabea28bab7b",
          },
          v26: {
            name: "26侧身正手发左侧上下旋后抢攻",
            md5: "d116993f5cb6fb8effa915b674235e72",
          },
          v27: { name: "27搓攻战术", md5: "0568c743eeaec7f4a89b1c8657e9d232" },
          v28: {
            name: "28全台左推右攻",
            md5: "b46fcc0841a4a3265c6f3f1fadad2b37",
          },
          v29: { name: "29跨步练习", md5: "89063e2b3235dfe25a688bfdfb9a147a" },
        },
        videoUrl: {},
        videoShow1: false,
        videoShow2: false,
        videoShow3: false,
        videoShow4: false,
        videoShow5: false,
      },
    };
  },
  created() {
    if (!this.isSearch) {
      this.getVideo(this.chapter002.videoMd5.v1.md5, "v1");
      this.getVideo(this.chapter002.videoMd5.v2.md5, "v2");
      this.getVideo(this.chapter002.videoMd5.v3.md5, "v3");
      this.getVideo(this.chapter002.videoMd5.v4.md5, "v4");
      this.getVideo(this.chapter002.videoMd5.v5.md5, "v5");
      this.getVideo(this.chapter002.videoMd5.v6.md5, "v6");

      setTimeout(() => {
        this.getVideo(this.chapter002.videoMd5.v7.md5, "v7");
        this.getVideo(this.chapter002.videoMd5.v8.md5, "v8");
        this.getVideo(this.chapter002.videoMd5.v9.md5, "v9");
        this.getVideo(this.chapter002.videoMd5.v10.md5, "v10");
        this.getVideo(this.chapter002.videoMd5.v11.md5, "v11");
        this.getVideo(this.chapter002.videoMd5.v12.md5, "v12");
      }, 1000);

      setTimeout(() => {
        this.getVideo(this.chapter002.videoMd5.v13.md5, "v13");
        this.getVideo(this.chapter002.videoMd5.v14.md5, "v14");
        this.getVideo(this.chapter002.videoMd5.v15.md5, "v15");
        this.getVideo(this.chapter002.videoMd5.v16.md5, "v16");
        this.getVideo(this.chapter002.videoMd5.v17.md5, "v17");
        this.getVideo(this.chapter002.videoMd5.v18.md5, "v18");
      }, 3000);

      setTimeout(() => {
        this.getVideo(this.chapter002.videoMd5.v19.md5, "v19");
        this.getVideo(this.chapter002.videoMd5.v20.md5, "v20");
        this.getVideo(this.chapter002.videoMd5.v21.md5, "v21");
        this.getVideo(this.chapter002.videoMd5.v22.md5, "v22");
        this.getVideo(this.chapter002.videoMd5.v23.md5, "v23");
        this.getVideo(this.chapter002.videoMd5.v24.md5, "v24");
      }, 5000);

      setTimeout(() => {
        this.getVideo(this.chapter002.videoMd5.v25.md5, "v25");
        this.getVideo(this.chapter002.videoMd5.v26.md5, "v26");
        this.getVideo(this.chapter002.videoMd5.v27.md5, "v27");
        this.getVideo(this.chapter002.videoMd5.v28.md5, "v28");
        this.getVideo(this.chapter002.videoMd5.v29.md5, "v29");
      }, 7000);
    }
  },
  methods: {
    async toUrl(val) {
      if (val) {
        window.open(await getResourcePath(this.chapter002.pdfMd5[val]));
      }
    },
    async getVideo(md5, val) {
      const data = await getResourcePath(md5);
      this.chapter002.videoUrl[val] = data;
    },
    ChangeBlur() {
      localStorage.setItem("chapter002", JSON.stringify(this.chapter002));
    },
    activityXyx1() {
      this.chapter002.isShowXyx01 = !this.chapter002.isShowXyx01;
    },
    activityXyx2() {
      this.isShowXyx02 = !this.isShowXyx02;
      this.chapter002.videoShow1 = true;
      setTimeout(() => {
        this.chapter002.videoShow2 = true;
      }, 1000);

      setTimeout(() => {
        this.chapter002.videoShow3 = true;
      }, 3000);

      setTimeout(() => {
        this.chapter002.videoShow4 = true;
      }, 5000);

      setTimeout(() => {
        this.chapter002.videoShow5 = true;
      }, 7000);
    },
  },
};
</script>

 src/books/sportsAndHealth/view/text.html

@@ -715,63 +715,4 @@
    <a id="m5"></a><a href="chapter002.html#w5">[5]</a>
    针对如溺水等气道堵塞类的心肺复苏，实施步骤有所区别，应先开放气道、清除气道中的积水及异物，再依次进行人工呼吸和胸外按压。
  </p>
</div>

<div class="page-box" page="21">
  <div v-if="showPageList.indexOf(21) > -1">
    <div class="bodystyle">
      <h3 class="lefth3" id="c016">
        <img class="img-gh1" alt="" src="../image/dy3-xm5.jpg" />
      </h3>
      <div class="bk-tyzg">
        <p class="bj1-tyzg">体育中国</p>
        <p class="block">
          自从乒乓球被列为奥运会比赛项目以来，我国获得了全部37枚金牌中的32枚。在2020年东京奥运会中，我国共获得男单、女单、男团、女团4枚金牌。截至2023年5月底，我国乒乓球队有117人获得世界冠军，获得259枚金牌（奥运会金牌32枚、世乒赛金牌156枚、世界杯金牌71枚）。
        </p>
        <p class="block">
          我国乒乓球名将众多，如邓亚萍等已退役的世界乒坛代表人物，又如拿到“大满贯”的现役乒乓球国手马龙、许昕等，均为推动我国乃至世界乒乓球的发展起到重要作用。
        </p>
      </div>
      <div class="bk-xyx">
        <p class="bj1-xyx">议一议</p>
        <p>1.请同学们搜索“乒乓外交”，并讨论其对我国外交方面的促进作用。</p>
        <p>
          2.请同学们搜索2020年东京奥运会乒乓球女团项目完赛后，我国国家乒乓球队与香港地区乒乓球队颁奖合影的照片，并讨论其积极意义。
        </p>
        <textarea rows="6" v-model="chapter002.textBybItem1"></textarea>
      </div>
      <div class="bk-dy3xxmb">
        <p class="bj1-dy3xxmb">学习目标</p>
        <p class="block">
          1.了解乒乓球运动的特点、价值、技术动作及基础战术配合的相关基础知识。
        </p>
        <p class="block">
          2.掌握乒乓球的正反手攻球、搓球和弧圈球技术，左推右攻、推挡侧身攻的组合技能，以及发球抢攻、接发球抢攻、对攻、搓攻等战术。
        </p>
        <p class="block">
          3.培养良好的体育锻炼习惯、遵守体育道德，积极参加班级和学校组织的乒乓球活动、比赛，在学练和比赛中培养遵纪守法、团结互助、积极乐观、勇于拼搏的品格。
        </p>
      </div>
      <h4 class="h4-dy3" id="d066">
        <span class="h4-dy3s">一</span>　了解乒乓球运动
      </h4>
      <div class="pdf-text">
        <p>
          乒乓球运动是一项由两名或四名运动员在乒乓球桌上进行隔网攻守的运动，在世界上许多地方流行。乒乓球运动1900年起源于英国，20世纪初在欧洲和亚洲蓬勃开展起来。乒乓球运动易于开展，打法多样，球路变化丰富，技术动作要求协调、灵敏、精确，观赏性强。乒乓球运动能有效发展力量、速度、耐力、灵敏性等身体素质，同时也能锻炼和培养勇敢、顽强、机智、果断等心理品质。乒乓球运动对今后从事需久坐、久站的职业，尤其是需要进行精细化操作的职业人群身体状况的改善有积极的作用。“乒乓精神”所蕴含的技术创新和精益求精也是同学们应该学习和践行的职业精神。乒乓球运动在国内外广泛开展，乒乓球世界杯、世锦赛与奥运会并称世界乒乓球三大赛事。
        </p>
        <div class="pdf-con">
          <div class="pdf-view">
            <img :src="pingpang" alt="" /><span @click="toUrl(1)"
              >乒乓球的常用术语（一）</span
            >
          </div>
          <div class="pdf-view">
            <img :src="pingpang" alt="" /><span @click="toUrl(2)"
              >乒乓球的常用术语（二）</span
            >
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

 src/components/examinations/index.vue

@@ -573,13 +573,13 @@
    },
    // 保存按钮
    saveAnswer() {
      const element = document.getElementsByClassName("examination")[0];
      const element = (this.container ? this.container : document
      ).querySelector(".examination");
      if (element) {
        const pageNum = this.getParentWithClass(
          element,
          "page-box"
        ).getAttribute("page");
        console.log(this.config.activeBook.name, pageNum);
        const oldAnswerData = localStorage.getItem(
          this.config.activeBook.name + "oldAnswerData"
        );

 src/components/matching/matching.vue

@@ -15,7 +15,7 @@
            :key="index"
            ref="left"
            @mousedown="(e) => touchstart(e, item, index)"
            :style="{backgroundColor:bc}"
            :style="{backgroundColor:primaryColor}"
          >
            {{ item.label.txt }}
          </div>
@@ -26,7 +26,7 @@
            v-for="(item, index) in rightArr"
            :key="index"
            ref="right"
            :style="{backgroundColor:bc}"
            :style="{backgroundColor:primaryColor}"
          >
            {{ item.label.txt }}
          </div>
@@ -48,13 +48,13 @@
    <!-- 按钮 -->
    <div class="btn-bottom">
      <el-button @click="submitData">提交</el-button>
      <el-button @click="saveData">保存</el-button>
      <el-button @click="redo">重做</el-button>
      <el-button @click="handleAnswer">查看答案</el-button>
      <el-button @click="saveData" :style="{borderColor:primaryColor}">保存</el-button>
      <el-button @click="redo" >重做</el-button>
      <el-button @click="handleAnswer" :style="{borderColor:primaryColor}">查看答案</el-button>
    </div>
    <!-- 解析 -->
    <ul class="show-answer" v-if="isShowAnswer">
      <li>答案结果：</li>
      <li v-if="isRight !== null">答案结果：<span v-if="isRight" style="color: #83e089;">正确</span> <span v-if="isRight == false" style="color:#d81e06">错误</span></li>
      <li class="show-answer-box">
        <div>答案:</div>
        <div>
@@ -85,7 +85,7 @@
      checkItemIndex: null,
      isShowAnswer: false,
      isRight: null,
      value:[{left:0,right:0}],
      value:[],
      pageNum:null
    };
  },
@@ -105,7 +105,7 @@
        return [];
      },
    },
    bc:{
    primaryColor:{
      type:String,
      default:"#0bab87"
    }
@@ -181,14 +181,15 @@
    },
    // 触摸结束
    touchend(e, index) {
      console.log("抬起", e, this.checkItem);
      this.isDragging = false;
      if (this.item.showAnswer) {
        return false;
      }
      // let event = e.changedTouches[0];
      // document.elementFromPoint 重点，根据x,y坐标 取当前元素 所有能运行的逻辑 都依托于这里。
      let dom = document.elementFromPoint(e.pageX, e.pageY);
      let dom = (
        this.container ? this.container : document
      ).elementFromPoint(e.pageX, e.pageY);
      // 右边的dom是哪个
      let right = this.rightDom.find((r) => r.bom === dom);
      // 不管是哪个都清除掉 底部的线
@@ -220,12 +221,11 @@
        .filter((r) => r.right !== undefined);
      this.$emit("input", model);
      this.item.userChoise = model;
      console.log(JSON.stringify(model));
      // console.log(JSON.stringify(model));
    },
    // 触摸开始
    touchstart(e, item, index) {
      this.isDragging = true;
      console.log("按下", e);
      this.checkItem = item;
      this.checkItemIndex = index;
      e.stopPropagation();
@@ -254,7 +254,6 @@
      if (this.item.showAnswer) {
        return false;
      }
      // console.log('移动',e);
      this.checkItem.line[2] = e.pageX;
      this.checkItem.line[3] =
        e.pageY - this.$refs.connect.getBoundingClientRect().y + this.scrollTop;
@@ -282,8 +281,8 @@
      canvasA.lineWidth = 2;
      for (let i = 0; i < this.leftArr.length; i++) {
        const line = this.leftArr[i].line;
        console.log(line);
        console.log(this.leftArr[i]);
        // console.log(line);
        // console.log(this.leftArr[i]);
        if (line.length) {
          canvasA.moveTo(line[0], line[1]);
          canvasA.lineTo(line[2], line[3]);
@@ -336,24 +335,20 @@
        const rightIndex = this.item.options.linkValues.findIndex(
          (citem) => citem.oldId == item.oldId
        );
        debugger;
        answerArr.push({
          left: index,
          right: rightIndex,
        });
      }
      this.isRight = this.areArraysEqual(this.item.userChoise,answerArr)
      console.log(
        "答案",
        answerArr,
        this.item.userChoise,
        this.isRight 
      );
      this.isShowAnswer =true
    },
    // 获取当前页码
    handlePage() {
      let pageNum = null
      const element = document.getElementsByClassName("matching")[0];
      const element = (
        this.container ? this.container : document
      ).querySelector("matching");
      if (element) {
        pageNum = this.getParentWithClass(
          element,
@@ -381,10 +376,11 @@
    saveData() {
      if(this.item.userChoise.length)
      localStorage.setItem(this.config.activeBook.name + '-matching-' + this.pageNum,JSON.stringify(this.item.userChoise))
      console.log('保存成功',this.config.activeBook.name,this.pageNum);
      // console.log('保存成功',this.config.activeBook.name,this.pageNum);
    },
    // 重做
    redo() {
      this.item.showAnswer = false
      localStorage.removeItem(this.config.activeBook.name + '-matching-' + this.pageNum)
      this.value = []
      for (let index = 0; index < this.leftArr.length; index++) {
@@ -394,6 +390,7 @@
      }
      this.leftArr
      this.drawing()
      this.isShowAnswer = false
    }
  },
};
@@ -438,7 +435,7 @@
      border-radius: 4px;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      margin-bottom: 20px;
      line-height: 40px;
      line-height: 24px;
      padding: 6px;
    }

@@ -460,10 +457,9 @@
  margin: 30px auto;
  width: 100%;
  height: min-content;
  // background-color: pink;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  .show-answer-box {
    padding: 10px;
  li {
    padding:10px
  }
}
.btn-bottom {
@@ -474,7 +470,7 @@
}
.el-button {
  height:30px;
  padding:9px;
  padding:7px;
  min-width: 78px
}
</style>

 src/components/miniAudio/index.vue

New file
@@ -0,0 +1,95 @@
<template>
  <div class="mini-audio" v-if="path">
    <audio controls :src="path" class="aduioPlayer"></audio>
    <svg
      @click="closeMiniAudio"
      t="1717642737563"
      class="icon close-btn"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="2426"
      width="24"
      height="24"
      xmlns:xlink="http://www.w3.org/1999/xlink"
    >
      <path
        d="M512 0C794.769794 0 1024 229.805588 1024 512 1024 794.769794 794.194408 1024 512 1024 229.230208 1024 0 794.194408 0 512 0 229.230208 229.805588 0 512 0ZM512 984.615385C772.648448 984.615385 984.615385 772.81286 984.615385 512 984.615385 251.351552 772.81286 39.384615 512 39.384615 251.351552 39.384615 39.384615 251.18714 39.384615 512 39.384615 772.648448 251.18714 984.615385 512 984.615385ZM512 539.849129 358.829792 693.019336C351.139468 700.70966 338.670988 700.70966 330.980664 693.019336 323.29034 685.329012 323.29034 672.860532 330.980664 665.170208L484.150871 512 330.980664 358.829792C323.29034 351.139468 323.29034 338.670988 330.980664 330.980664 338.670988 323.29034 351.139468 323.29034 358.829792 330.980664L512 484.150871 665.170208 330.980664C672.860532 323.29034 685.329012 323.29034 693.019336 330.980664 700.70966 338.670988 700.70966 351.139468 693.019336 358.829792L539.849129 512 693.019336 665.170208C700.70966 672.860532 700.70966 685.329012 693.019336 693.019336 685.329012 700.70966 672.860532 700.70966 665.170208 693.019336L512 539.849129Z"
        
        p-id="2427"
      ></path>
    </svg>
  </div>
</template>

<script>
export default {
  name: "mini-audio",
  props: {
    path: {
      type: String,
    },
    currentTime: {
      type: Number,
    },
  },
  watch: {
    path: {
      handler(newVal) {
        if (newVal) {
          setImmediate(() => {
            this.play();
          }, 200);
        }
      },
    },
  },
  methods: {
    play() {
      const player = (this.container ? this.container : document).querySelector(
        ".aduioPlayer"
      );
      if (player) {
        player.currentTime = this.currentTime;
        player.play();
      }
    },
    getVideoPlayer() {
      let obj = null;
      const player = (this.container ? this.container : document).querySelector(
        ".aduioPlayer"
      );
      if (player) {
        obj = {
          currentTime: player.currentTime,
          paused: player.paused,
        };
      }
      return obj;
    },
    closeMiniAudio() {
      this.$emit("closeMiniAudio");
    },
  },
};
</script>

<style lang="less" scoped>
.mini-audio {
  position: fixed;
  right: 40px;
  bottom: 100px;
  display: flex;
  align-items: center;
  background-color: #f1f3f4;
  border-radius: 30px;
  padding: 0 10px 0 0px;
}
.close-btn {
  cursor: pointer;
  fill:#868383;
  &:hover {
    fill: #d1cbcb;
  }
}
</style>