From b85d3d0d9e957e9f01952292f55870f1cb19baaa Mon Sep 17 00:00:00 2001 From: user1 <10901603+no-distractions1@user.noreply.gitee.com> Date: 星期二, 25 六月 2024 16:05:56 +0800 Subject: [PATCH] 英语分页(前50页) --- src/App.vue | 132 +++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 123 insertions(+), 9 deletions(-) diff --git a/src/App.vue b/src/App.vue index 031b363..ef3b19b 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,19 +1,77 @@ <template> <div id="app"> - <childHealth v-if="config.activeBook.name == 'childHealth'"></childHealth> - <!-- <English v-if="activeBook == 'English'"></English> --> + <childHealth v-if="activeBook.name == 'childHealth'"></childHealth> + <lifeCare v-if="activeBook.name == 'lifeCare'"></lifeCare> + <embedded v-if="activeBook.name == 'embedded'"></embedded> + <english v-if="activeBook.name == 'english'"></english> + <sportsAndHealth + v-if="activeBook.name == 'sportsAndHealth'" + ></sportsAndHealth> + <artAndDance v-if="activeBook.name == 'artAndDance'"></artAndDance> + <artAndDrama v-if="activeBook.name == 'artAndDrama'"></artAndDrama> + <mathBook v-if="activeBook.name == 'mathBook'"></mathBook> </div> </template> <script> -import childHealth from "./books/childHealth/view/index.vue"; -// import English from './books/English/view/index.vue' - export default { name: "App", components: { - childHealth - // English + childHealth: () => import("./books/childHealth/view/index.vue"), + lifeCare: () => import("./books/lifeCare/view/index.vue"), + embedded: () => import("./books/embedded/view/index.vue"), + english: () => import("./books/english/view/index.vue"), + sportsAndHealth: () => import("./books/sportsAndHealth/view/index.vue"), + artAndDance: () => import("./books/artAndDance/view/index.vue"), + mathBook: () => import("./books/mathBook/view/index.vue"), + artAndDrama: () => import("./books/artAndDrama/view/index.vue") + }, + data() { + return { + activeBook: {} + }; + }, + async created() { + if (this.setGlobalState) { + this.setGlobalState({ + initTestBook: async (bookId, tryPageCount) => { + this.activeBook = await this.config.getBookConfig( + process.env.VUE_APP_RESOURCE_CTX + process.env.VUE_APP_BOOK_ID + ); + this.config.activeBook = this.activeBook; + this.config.goodsStore = this.activeBook.storeRefcode; + if (tryPageCount) { + this.activeBook.tryPageCount = tryPageCount; + } + if ( + (this.$store.state.qiankun, this.$store.state.qiankun.getBookConfig) + ) { + this.$store.state.qiankun.getBookConfig({ + bookConfig: this.activeBook + }); + } + } + }); + } else { + // childHealth + // lifeCare + // sportsAndHealth + // embedded + // english + // artAndDance + // artAndDrama + // mathBook + this.activeBook = await this.config.getBookConfig( + process.env.VUE_APP_RESOURCE_CTX + + (process.env.VUE_APP_ENV == "product" + ? process.env.VUE_APP_BOOK_ID + : "english") + ); + // 娴嬭瘯璇曡30椤� + // this.activeBook.tryPageCount = 10; + this.config.activeBook = this.activeBook; + this.config.goodsStore = this.activeBook.storeRefcode; + } } }; </script> @@ -32,7 +90,7 @@ .highLight { border: 1px dashed rgba(255, 255, 255, 0); border-radius: 5px; - padding: 3px; + padding: 3px 0; cursor: pointer; } .highLight:hover { @@ -41,7 +99,7 @@ .underline { border: 1px dashed rgba(255, 255, 255, 0); - padding: 5px; + padding: 5px 0; border-radius: 5px; text-decoration: underline; text-decoration-style: wavy; @@ -55,5 +113,61 @@ .notesline { padding-bottom: 2px; border-bottom: 2px solid; + cursor: pointer; +} + +/* swiper */ +.swiper-container { + width: 100%; + height: 100%; +} + +.swiper-pagination-bullet-active { + background-color: #0093ff; +} + +.swiper-button-prev, +.swiper-button-next { + width: 27px; + height: 44px; + margin-top: -22px; + z-index: 10; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + color: #0093ff; +} + +.swiper-button-prev:after, +.swiper-button-next:after { + font-family: swiper-icons; + font-size: 30px; + text-transform: none !important; + letter-spacing: 0; + text-transform: none; + font-variant: initial; + line-height: 1; +} + +.imgBox { + position: relative; +} + +.imgBox img { + max-width: 100%; + max-height: 100%; + width: auto; + height: auto; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + margin: auto; +} + +.openImgBox img { + cursor: zoom-in; } </style> -- Gitblit v1.9.1