| | |
| | | <template> |
| | | <div |
| | | class="public-books" |
| | | @scroll="throttledScrollHandler" |
| | | @mouseup="handleMouseUp" |
| | | :style="{ |
| | | fontSize: fontSize ? fontSize + 'px' : '16px', |
| | | transform: `scale(${pageZoom ? pageZoom : 1})`, |
| | | }" |
| | | > |
| | | <front001 v-if="showCatalogList.indexOf(0) > -1" /> |
| | | <ChapterOne v-if="showCatalogList.indexOf(1) > -1" /> |
| | | <ChapterTwo v-if="showCatalogList.indexOf(2) > -1" /> |
| | | <ChapterThree v-if="showCatalogList.indexOf(3) > -1" /> |
| | | <ChapterFour v-if="showCatalogList.indexOf(4) > -1" /> |
| | | <ChapterFive v-if="showCatalogList.indexOf(5) > -1" /> |
| | | <chapterSix v-if="showCatalogList.indexOf(6) > -1" /> |
| | | <!-- <chapterSix /> --> |
| | | <!-- <chapterSeven /> --> |
| | | <!-- <chapterEight /> --> |
| | | <!-- <chapterNine /> --> |
| | | <!-- <chapter010 /> --> |
| | | <!-- <chapter011 /> --> |
| | | <!-- <chapter012 /> --> |
| | | <!-- <chapter013 /> --> |
| | | <!-- <chapter014 /> --> |
| | | <!-- <chapter015 /> --> |
| | | <!-- <chapter016 /> --> |
| | | <!-- <chapter017 /> --> |
| | | <!-- <topic008 /> --> |
| | | <div class="page-main" @scroll="throttledScrollHandler"> |
| | | <div |
| | | class="public-books" |
| | | @mouseup="handleMouseUp" |
| | | :style="{ |
| | | fontSize: fontSize ? fontSize + 'px' : '16px', |
| | | transform: `scale(${pageZoom ? pageZoom : 1})`, |
| | | }" |
| | | > |
| | | <front001 v-if="showCatalogList.indexOf(0) > -1" /> |
| | | <ChapterOne v-if="showCatalogList.indexOf(1) > -1" /> |
| | | <ChapterTwo v-if="showCatalogList.indexOf(2) > -1" /> |
| | | <ChapterThree v-if="showCatalogList.indexOf(3) > -1" /> |
| | | <ChapterFour v-if="showCatalogList.indexOf(4) > -1" /> |
| | | <ChapterFive v-if="showCatalogList.indexOf(5) > -1" /> |
| | | <chapterSix v-if="showCatalogList.indexOf(6) > -1" /> |
| | | <!-- <chapterSix /> --> |
| | | <!-- <chapterSeven /> --> |
| | | <!-- <chapterEight /> --> |
| | | <!-- <chapterNine /> --> |
| | | <!-- <chapter010 /> --> |
| | | <!-- <chapter011 /> --> |
| | | <!-- <chapter012 /> --> |
| | | <!-- <chapter013 /> --> |
| | | <!-- <chapter014 /> --> |
| | | <!-- <chapter015 /> --> |
| | | <!-- <chapter016 /> --> |
| | | <!-- <chapter017 /> --> |
| | | <!-- <topic008 /> --> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | import chapter015 from "./view/chapter015"; |
| | | import chapter016 from "./view/chapter016"; |
| | | import chapter017 from "./view/chapter017"; |
| | | |
| | | import NoteIcon from "@/assets/images/biji.png"; |
| | | import _ from "lodash"; |
| | | export default { |
| | | name: "temp-book", |
| | | data() { |
| | | return { |
| | | catalogLength: 13, // 总章节数 |
| | | catalogLength: 7, // 总章节数 |
| | | showCatalogList: [], // 显示的章节 |
| | | loadThreshold: 300, // 触发加载阈值 |
| | | throttleThreshold: 100, // 节流阈值 |
| | |
| | | showCatalogList: newVal, |
| | | }); |
| | | } |
| | | |
| | | // 启动页码观察 |
| | | setTimeout(() => { |
| | | this.initObservation(); |
| | |
| | | // 向下 |
| | | const currentScrollTop = |
| | | event.target.scrollTop + event.target.offsetHeight; |
| | | |
| | | if ( |
| | | currentScrollTop >= |
| | | event.target.scrollHeight - this.loadThreshold |
| | |
| | | const borderColorDom = ( |
| | | this.container ? this.container : document |
| | | ).querySelectorAll(".theme-border"); |
| | | console.log(this.config, "this.configthis.config"); |
| | | // 获取配置的主题色 |
| | | const bookThemeColor = |
| | | this.config.activeBook && this.config.activeBook.bookThemeColor |
| | |
| | | "chapter" |
| | | ); |
| | | const catalog = catalogDom.getAttribute("num"); |
| | | console.log("page", page, catalog); |
| | | // 返回页码和章节信息 |
| | | if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange) |
| | | this.$store.state.qiankun.pageChange({ |