From fe07e8a02cb41daac4d34562474b56dec5ab3efd Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期四, 06 六月 2024 11:57:40 +0800 Subject: [PATCH] 音频小窗 --- src/App.vue | 87 +++++++++++++++++++++++++++++++++++++++---- 1 files changed, 79 insertions(+), 8 deletions(-) diff --git a/src/App.vue b/src/App.vue index 4b09bef..8f7eebb 100644 --- a/src/App.vue +++ b/src/App.vue @@ -4,6 +4,10 @@ <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> </div> </template> @@ -12,6 +16,8 @@ import lifeCare from "./books/lifeCare/index.vue"; import embedded from "./books/embedded/view/index.vue"; import english from "./books/English/view/index.vue"; +import sportsAndHealth from "./books/sportsAndHealth"; +import artAndDance from './books/artAndDance/view/index.vue' export default { name: "App", @@ -20,10 +26,12 @@ lifeCare, embedded, english, + sportsAndHealth, + artAndDance }, data() { return { - activeBook: {}, + activeBook: {} }; }, async created() { @@ -32,6 +40,8 @@ initTestBook: async (bookId, tryPageCount) => { // this.activeBook = await this.config.getBookConfig(this.config.resourceCtx + bookId); if ( + // "http://182.92.203.7:3007/books/resource/" + // "https://jsek.bnuic.com/books/resource/" this.config.resourceCtx == "http://182.92.203.7:3007/books/resource/" ) { @@ -45,25 +55,31 @@ if (tryPageCount) { this.activeBook.tryPageCount = tryPageCount; } - console.log("鍥句功", this.activeBook); if ( (this.$store.state.qiankun, this.$store.state.qiankun.getBookConfig) ) { this.$store.state.qiankun.getBookConfig({ - bookConfig: this.activeBook, + bookConfig: this.activeBook }); } - }, + } }); } else { this.activeBook = await this.config.getBookConfig( // childHealth - this.config.resourceCtx + "lifeCare" + // lifeCare + // sportsAndHealth + // embedded + // english + // artAndDance + this.config.resourceCtx + "english" ); + // 娴嬭瘯璇曡30椤� + // this.activeBook.tryPageCount = 10; this.config.activeBook = this.activeBook; this.config.goodsStore = this.activeBook.storeRefcode; } - }, + } }; </script> @@ -81,7 +97,7 @@ .highLight { border: 1px dashed rgba(255, 255, 255, 0); border-radius: 5px; - padding: 3px; + padding: 3px 0; cursor: pointer; } .highLight:hover { @@ -90,7 +106,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; @@ -107,4 +123,59 @@ 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