unknown
2024-05-29 13dbb7d053efa1fef63d76ecd5cbebbdbc919a24
src/books/lifeCare/index.vue
@@ -1,33 +1,99 @@
<template>
  <div class="page-main" @scroll="throttledScrollHandler">
    <div
      class="public-books"
      class="public-lifCare"
      @mouseup="handleMouseUp"
      :style="{
        fontSize: fontSize ? fontSize + 'px' : '16px',
        transform: `scale(${pageZoom ? pageZoom : 1})`,
        transformOrigin: 'center top'
        transformOrigin: 'center top',
      }"
    >
    <front001 v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList" />
      <ChapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" :questionData="questionData"/>
      <ChapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList" :questionData="questionData"/>
      <ChapterThree v-if="showCatalogList.indexOf(4) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <ChapterFour v-if="showCatalogList.indexOf(5) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <ChapterFive v-if="showCatalogList.indexOf(6) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <chapterSix v-if="showCatalogList.indexOf(7) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <chapterSeven v-if="showCatalogList.indexOf(8) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <chapterEight v-if="showCatalogList.indexOf(9) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <chapterNine v-if="showCatalogList.indexOf(10) > -1"  :showPageList="loadPageList" :questionData="questionData"/>
      <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" />
      <front001
        v-if="showCatalogList.indexOf(1) > -1"
        :showPageList="loadPageList"
      />
      <ChapterOne
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <ChapterTwo
        v-if="showCatalogList.indexOf(3) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <ChapterThree
        v-if="showCatalogList.indexOf(4) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <ChapterFour
        v-if="showCatalogList.indexOf(5) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <ChapterFive
        v-if="showCatalogList.indexOf(6) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <chapterSix
        v-if="showCatalogList.indexOf(7) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <chapterSeven
        v-if="showCatalogList.indexOf(8) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <chapterEight
        v-if="showCatalogList.indexOf(9) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <chapterNine
        v-if="showCatalogList.indexOf(10) > -1"
        :showPageList="loadPageList"
        :questionData="questionData"
      />
      <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>
@@ -68,7 +134,7 @@
      observer: null,
      loadPageObserver: null,
      loadPageList: [],
      questionData: {}
      questionData: {},
    };
  },
  computed: {
@@ -77,11 +143,11 @@
    },
    pageZoom() {
      return this.$store.state.qiankun.scale / 100;
    }
    },
  },
  provide() {
    return {
      changeQuestionData: this.changeQuestionData
      changeQuestionData: this.changeQuestionData,
    };
  },
  watch: {
@@ -93,7 +159,7 @@
        ) {
          // 调用父层方法
          this.$store.state.qiankun.catalogChange({
            showCatalogList: newVal
            showCatalogList: newVal,
          });
        }
        // 启动页码观察
@@ -101,8 +167,8 @@
          this.initObservation();
          this.initThemeColor();
        }, 500);
      }
    }
      },
    },
  },
  mounted() {
    // 默认加载章节
@@ -127,7 +193,7 @@
        // 删除笔记、高亮、划线
        delSign: (data) => {
          this.delSign(data);
        }
        },
      });
    }
@@ -136,13 +202,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,表示当目标元素一半或更多显示在视窗中时触发回调函数。
    });
    // 启动页码观察
@@ -277,7 +343,7 @@
          this.showCatalogList = [
            this.catalogLength - 2,
            this.catalogLength - 1,
            this.catalogLength
            this.catalogLength,
          ];
        } else {
          this.showCatalogList = [catalog - 1, catalog, catalog + 1];
@@ -494,7 +560,7 @@
          if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange)
            this.$store.state.qiankun.pageChange({
              page: page,
              catalog: catalog
              catalog: catalog,
            });
          // const sections = Array.from(document.querySelectorAll(".section"));
          //sections:获取所有具有 .section 类名的元素,并转换为数组。
@@ -549,7 +615,7 @@
    },
    changeQuestionData(page, data) {
      this.$props.questionData[page] = data;
    }
    },
  },
  components: {
    front001,
@@ -571,7 +637,7 @@
    chapter016,
    chapter017,
    chapter018,
  }
  },
};
</script>