闫增涛
2024-11-19 d8c24a06b3e7844ad65e7c821c022dbb36d29430
src/books/sportsAndHealth/view/components/index.vue
@@ -15,85 +15,12 @@
      <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList"></chapterTwo>
      <chapterThree v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList"></chapterThree>
      <chapterFour v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList"></chapterFour>
      <!-- <assemblyOne v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList"></assemblyOne> -->
      <chapterfive v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList"></chapterfive>
      <chapterSix v-if="showCatalogList.indexOf(7) > -1" :showPageList="loadPageList"></chapterSix>
      <chapterSeven v-if="showCatalogList.indexOf(8) > -1" :showPageList="loadPageList"></chapterSeven>
      <chapterEight v-if="showCatalogList.indexOf(9) > -1" :showPageList="loadPageList"></chapterEight>
      <chapterNine v-if="showCatalogList.indexOf(10) > -1" :showPageList="loadPageList"></chapterNine>
      <!-- <assemblyTwo v-if="showCatalogList.indexOf(7) > -1" :showPageList="loadPageList" @openPDFChange="swdtChange" /> -->
      <!-- <ChapterFour
        v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
      /> -->
      <!-- <ChapterFive
        v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        @Upload_initViewer="changeDomViewer"
      /> -->
      <!-- <chapterSix
        v-if="showCatalogList.indexOf(7) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
      /> -->
      <!-- <chapterSeven
        v-if="showCatalogList.indexOf(8) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
        @eventSwdt="swdtChange"
        @Upload_initViewer="changeDomViewer"
      /> -->
      <!-- <chapterEight
        v-if="showCatalogList.indexOf(9) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
      /> -->
      <!-- <chapterNine
        v-if="showCatalogList.indexOf(10) > -1"
        :showPageList="loadPageList"
        :questionData="questionDataMap"
      /> -->
      <!-- <chapter010
        v-if="showCatalogList.indexOf(11) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter011
        v-if="showCatalogList.indexOf(12) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter012
        v-if="showCatalogList.indexOf(13) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter013
        v-if="showCatalogList.indexOf(14) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter014
        v-if="showCatalogList.indexOf(15) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter015
        v-if="showCatalogList.indexOf(16) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter016
        v-if="showCatalogList.indexOf(17) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter017
        v-if="showCatalogList.indexOf(18) > -1"
        :showPageList="loadPageList"
      /> -->
      <!-- <chapter018
        v-if="showCatalogList.indexOf(19) > -1"
        :showPageList="loadPageList"
      /> -->
    </div>
  </div>
</template>
@@ -110,9 +37,7 @@
import chapterSix from './chapter006.vue'
import chapterSeven from './chapter007.vue'
import chapterEight from './chapter008.vue'
// import assemblyOne from "./testDynaicTable.vue";
import assemblyTwo from './testPp.vue'
import chapterNine from './chapter009.vue'
import NoteIcon from '@/assets/images/biji.png'
import _ from 'lodash'
@@ -125,7 +50,7 @@
export default {
  data() {
    return {
      catalogLength: 9, // 总章节数
      catalogLength: 10, // 总章节数
      showCatalogList: [], // 显示的章节
      loadThreshold: 300, // 触发加载阈值
      throttleThreshold: 100, // 节流阈值
@@ -171,7 +96,7 @@
        setTimeout(() => {
          this.initSwiper()
          this.initViewer()
          this.readText()
          // this.readText()
        }, 200)
      },
    },
@@ -242,8 +167,8 @@
    }, 500)
    // 测试页面跳转
    setTimeout(() => {
      this.gotoPage(9, 248)
    // setTimeout(() => {
    //   this.gotoPage(1, 41)
      //   setTimeout(() => {
      //     this.renderSign("Highlight", {
      //       id: "2ACA9359",
@@ -271,7 +196,7 @@
      //   txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼(见图1-1)。骨骼是人体的支架,具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下,肌肉收缩牵动所附着的骨绕着关节转动,使身体产生各种动作。所以,运动系统具有运动、支持和保护等功能,幼年时期的骨骼还具有造血功能。 ",
      //   txtIndex: 57
      // });
    }, 500)
    // }, 500)
  },
  methods: {
    swdtChange(data) {
@@ -372,9 +297,11 @@
          const pageDom = (
            this.container ? this.container : document
          ).querySelector(`[page="${page}"]`)
          if (pageDom) {
            pageDom.scrollIntoView()
          } else {
            console.log('页码错误!')
          }
        }, 500)
@@ -816,7 +743,8 @@
        chapterfive,
        chapterSix,
        chapterSeven,
        chapterEight
        chapterEight,
        chapterNine
        // assemblyOne,
        // assemblyTwo,
      }
@@ -920,30 +848,30 @@
      // 跳转
      this.gotoPage(data.catalog, data.page, () => { })
    },
    readText() {
      const doms = (
        this.container ? this.container : document
      ).querySelectorAll('.read-aloud')
      for (let index = 0; index < doms.length; index++) {
        const dom = doms[index]
        let id = null
        dom.addEventListener('click', (e) => {
          if (e.srcElement.nodeName == 'svg') {
            id = dom.getAttribute('readId')
          } else if (e.srcElement.nodeName == 'g') {
            const svgDom = e.srcElement.parentNode
            id = svgDom.getAttribute('readId')
          } else {
            const svgDom = e.srcElement.parentNode.parentNode
            id = svgDom.getAttribute('readId')
          }
          const item = (
            this.container ? this.container : document
          ).querySelector('#' + id).innerText
          console.log(item, 233)
        })
      }
    },
    // readText() {
    //   const doms = (
    //     this.container ? this.container : document
    //   ).querySelectorAll('.read-aloud')
    //   for (let index = 0; index < doms.length; index++) {
    //     const dom = doms[index]
    //     let id = null
    //     dom.addEventListener('click', (e) => {
    //       if (e.srcElement.nodeName == 'svg') {
    //         id = dom.getAttribute('readId')
    //       } else if (e.srcElement.nodeName == 'g') {
    //         const svgDom = e.srcElement.parentNode
    //         id = svgDom.getAttribute('readId')
    //       } else {
    //         const svgDom = e.srcElement.parentNode.parentNode
    //         id = svgDom.getAttribute('readId')
    //       }
    //       const item = (
    //         this.container ? this.container : document
    //       ).querySelector('#' + id).innerText
    //       console.log(item, 233)
    //     })
    //   }
    // },
  },
  components: {
    pageHeader,
@@ -954,7 +882,8 @@
    chapterfive,
    chapterSix,
    chapterSeven,
    chapterEight
    chapterEight,
    chapterNine
    // assemblyOne,
    // assemblyTwo,
    // ChapterFour,