From f88ff0052009bc4040f3decb8e9e80a4acc563bf Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期五, 20 十二月 2024 10:59:14 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TextbookReader --- src/views/readerPages/webHome.vue | 636 +++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 495 insertions(+), 141 deletions(-) diff --git a/src/views/readerPages/webHome.vue b/src/views/readerPages/webHome.vue index e4f1f31..0bb5ff2 100644 --- a/src/views/readerPages/webHome.vue +++ b/src/views/readerPages/webHome.vue @@ -6,8 +6,15 @@ <span></span> <div class="userInfoBox"> <div class="userName" v-if="userInfo.name">{{ userInfo.name }}</div> - <div v-if="token"><div class="layout hover" @click="layoutBtn">閫�鍑�</div></div> - <div v-else><div class="layout hover" @click="goLogin">鐧诲綍</div></div> + <div v-if="token"> + <div class="layout hover" @click="layoutBtn">閫�鍑�</div> + </div> + <div v-else> + <div class="layout hover" @click="goLogin">鐧诲綍</div> + </div> + <!-- <div> + <div class="layout hover" @click="openFormulaDialog">鍏紡</div> + </div> --> </div> </div> <div class="contentBox"> @@ -196,9 +203,12 @@ @click="searchClose(index)" v-if="searchReaultData.isShow && searchReaultData.openIndex == index" class="hover" - ><ArrowDown - /></el-icon> - <el-icon @click="searchOpen(index)" v-else class="hover"><ArrowRight /></el-icon> + > + <ArrowDown /> + </el-icon> + <el-icon @click="searchOpen(index)" v-else class="hover"> + <ArrowRight /> + </el-icon> <span>{{ reault.chapterName }} 锛坽{ reault.itemList.length }}锛�</span> </div> <div @@ -249,9 +259,12 @@ @click="noteClose(index)" v-if="scribeData.isShow && scribeData.openIndex == index" class="hover" - ><ArrowDown - /></el-icon> - <el-icon @click="noteOpen(index)" v-else class="hover"><ArrowRight /></el-icon> + > + <ArrowDown /> + </el-icon> + <el-icon @click="noteOpen(index)" v-else class="hover"> + <ArrowRight /> + </el-icon> <span>{{ noteItem.chapterName }}</span> </div> <div @@ -368,66 +381,97 @@ ><VideoCamera /></el-icon> --> <!-- <el-icon v-else-if="activeClassify == 'other'" size="30"><Files /></el-icon> --> - <img src="@/assets/images/resource/yp-mr.png" v-else-if="activeClassify == 'audio'" /> - <img src="@/assets/images/resource/sp-mr.png" v-else-if="activeClassify == 'video'" /> - <img src="@/assets/images/resource/qt-mr.png" v-else-if="activeClassify == 'other'" /> + <img + src="@/assets/images/resource/yp-mr.png" + v-else-if="activeClassify == 'audio'" + /> + <img + src="@/assets/images/resource/sp-mr.png" + v-else-if="activeClassify == 'video'" + /> + <img + src="@/assets/images/resource/qt-mr.png" + v-else-if="activeClassify == 'other'" + /> <div class="handleBox" v-if="showHandle == index"> <div class="delImg"> <el-icon class="icon hover" size="20" @click="JumpPosition(item)" - v-if="resourceType == 'default'" - ><LocationInformation - /></el-icon> + v-if="item.pagination" + > + <LocationInformation /> + </el-icon> <el-icon @click="goPlay(item)" size="20" class="icon hover" v-if="item.resourceType == '瑙嗛'" - ><VideoPlay - /></el-icon> + > + <VideoPlay /> + </el-icon> <el-icon @click="goPlay(item, index)" size="20" class="icon hover" v-if="item.resourceType == '闊抽' && playIndex != index" - ><VideoPlay - /></el-icon> + > + <VideoPlay /> + </el-icon> <el-icon @click="goPause()" size="20" class="icon hover" v-if="item.resourceType == '闊抽' && playIndex == index" - ><VideoPause - /></el-icon> + > + <VideoPause /> + </el-icon> <el-icon @click="getCapture(item, index)" size="20" class="icon hover" v-if="item.resourceType == '鍥剧墖'" - ><View - /></el-icon> + > + <View /> + </el-icon> + <!-- 鍏朵粬绫诲瀷棰勮鎴栫洿鎺ヤ笅杞� --> + <el-icon + @click="goPlay(item)" + size="20" + class="icon hover" + v-if="item.resourceType != '瑙嗛' && item.resourceType != '闊抽' && item.resourceType != '鍥剧墖'" + > + <View /> + </el-icon> <el-icon size="20" class="icon hover" - @click="goPlay(item)" - v-if=" - !( - item.resourceType == '瑙嗛' || - item.resourceType == '闊抽' || - item.resourceType == '涔犻' || - item.resourceType == '鍥剧墖' - ) && item.isDownload == '鏄�' - " - ><Download - /></el-icon> + @click="goDownload(item)" + v-if="item.isDownload == '鏄�'" + > + <Download /> + </el-icon> <!-- 鏀惰棌鎸夐挳 --> - <img - :src="collectResourceList.findIndex(citem => citem.id == item.id) > -1 ? isHeart : heart " - class="icon hover" - style="width: 15px;" - @click="handleCollectResource(item.id,item.md5 ? item.md5 : '',item.resourcePath ? item.resourcePath : '',item.resourceType,item.resourceType == '瑙嗛' || '闊抽' ? 'bits' : 'json',item.resourceName)" /> + <img + :src=" + collectResourceList.findIndex((citem) => citem.id == item.id) > -1 + ? isHeart + : heart + " + class="icon hover" + style="width: 15px" + @click=" + handleCollectResource( + item.id, + item.md5 ? item.md5 : '', + item.resourcePath ? item.resourcePath : '', + item.resourceType, + item.resourceType == '瑙嗛' || '闊抽' ? 'bits' : 'json', + item.resourceName + ) + " + /> </div> </div> </div> @@ -458,9 +502,9 @@ <img :src="item.imgUrl" class="capture hover" mode="aspectFill" /> <div class="deleteBox" v-if="showDelete == index"> <div class="delImg"> - <el-icon @click="getCapture(item, index)" size="18" class="icon hover" - ><View - /></el-icon> + <el-icon @click="getCapture(item, index)" size="18" class="icon hover"> + <View /> + </el-icon> <img :src="bianji" class="icon hover" @click="updateScreenshot(item)" /> <img :src="shanchu" class="icon hover" @click="deleteScreenshot(item)" /> </div> @@ -537,9 +581,9 @@ </div> <!-- 棰樺簱搴曢儴鏀惰棌澶瑰拰閿欓闆� --> <ul class="question-bottom" v-if="activeMenu == '棰樺簱'"> - <li @click="selectExercisesType('collection')">鏀惰棌澶�</li> - <li @click="selectExercisesType('wrong')">閿欓鏈�</li> - </ul> + <li @click="selectExercisesType('collection')">鏀惰棌澶�</li> + <li @click="selectExercisesType('wrong')">閿欓鏈�</li> + </ul> <!-- 鑿滃崟鍐呭鏀惰捣 --> <div class="menuStateBox" v-if="menuState.open"> <svg @@ -816,7 +860,7 @@ </div> </div> <!-- 璇煶闃呰缁勪欢 --> - <!-- <div class="voice-reader"> + <!-- <div class="voice-reader"> <voiceReader /> </div> --> </div> @@ -1108,9 +1152,17 @@ <video controls controlslist="nodownload" :src="testVideo"></video> </div> - <!-- <div class="wordBox" v-if="resourType == 'word'"> - <vue-office-docx :src="testWord" /> - </div> --> + <div class="wordBox" v-if="resourType == 'PDF' || resourType == 'PPT' || resourType == 'WORD'"> + <div + v-for="(item, index) in showData" + :key="index" + class="pdfItem" + :page="index + 1" + > + <img :src="item.showSrc" alt="" style="min-height: 550px" loading="lazy" /> + <el-divider content-position="center"> 绗� {{ index + 1 }} 椤� </el-divider> + </div> + </div> </el-dialog> <div class="audioBox" v-show="false"> <!-- <video controls controlslist="nodownload" :src="testVideo"></video> --> @@ -1219,7 +1271,12 @@ </el-dialog> <el-dialog title="妯″瀷宸ュ叿" align-center v-model="modelToolVisble" width="80%" class="myDialogs"> <div class="wendabox"> - <iframe src="https://adjam93.github.io/threejs-model-viewer/#" frameborder="0"></iframe> + <iframe :src="sceneUrl" frameborder="0"></iframe> + </div> + </el-dialog> + <el-dialog title="妯″瀷宸ュ叿" align-center v-model="modelTool" width="80%" class="myDialogs"> + <div class="wendabox"> + <iframe src='https://adjam93.github.io/threejs-model-viewer/#' frameborder="0"></iframe> </div> </el-dialog> <el-dialog title="鐢熻瘝鍗$墖" align-center v-model="shengciVisble" width="800" class="myDialogs"> @@ -1238,6 +1295,16 @@ <wrongQuestion /> </div> </el-dialog> + <el-dialog + title="鍏紡缂栬緫" + align-center + v-model="formulaDialog" + class="myDialogs" + > + <div class="wendabox"> + <formula /> + </div> + </el-dialog> <!-- 绛旈鍣� --> <examination ref="examinationRef" @@ -1247,23 +1314,20 @@ :infoType="examinationData.infoType" /> <!-- 璁$畻鍣� --> - <el-dialog title="璁$畻鍣�" align-center v-model="calculatorVisble" width="550" style="height:548px"> - <calculator /> - </el-dialog> + <el-dialog title="璁$畻鍣�" align-center v-model="calculatorVisble" width="850" class="myDialogs"> + <!-- <calculatorNew></calculatorNew> --> + <iframe src="https://www.geogebra.org/scientific" frameborder="0" class="iframe-box"></iframe> + </el-dialog> </template> - <script setup lang="ts"> -import heart from '@/assets/images/examination/collectIcon.png' -import isHeart from '@/assets/images/examination/collectClickIcon.png' +import examination from '@/views/examination/index.vue' import { ref, reactive, watch, onMounted, onBeforeMount, onBeforeUnmount, inject } from 'vue' import { useRouter, useRoute } from 'vue-router' +import { ElMessage, ElMessageBox, valueEquals } from 'element-plus' import useClipboard from 'vue-clipboard3' -import examination from '../examination/index.vue' -import calculator from '../components/calculator.vue' const { toClipboard } = useClipboard() const MG: any = inject('MG') const toolClass = inject('toolClass') -const qiankunActions = inject('qiankunActions') //鑾峰彇璺敱鍣� let router = useRouter() //鑾峰彇褰撳墠璺敱鐨勪俊鎭� @@ -1271,9 +1335,9 @@ import moment from 'moment' import dictionary from '@/views/components/dictionary.vue' import newWord from '@/views/components/newWord.vue' +import formula from '@/views/components/formula.vue' import wrongQuestion from '@/views/components/wrongQuestion.vue' import voiceReader from '@/views/components/voiceReader.vue' -import { ElMessage, ElMessageBox, valueEquals } from 'element-plus' import logo from '@/assets/images/header/logo.png' import mulu from '@/assets/images/menu/mulu.png' import biji from '@/assets/images/menu/biji.png' @@ -1382,9 +1446,16 @@ const bookConfig = ref({}) const activeCatalog = ref() const reMarResult = ref() +const bookInfo = ref() +const isBuy = ref(false) +const tryPageCount = ref(0) +const searchText = ref() onMounted(() => { if (token) { getUserInfo() + } + if (localStorage.getItem('bookId')) { + getBookInfo() } setTimeout(() => { canvasWith.value = document.querySelector('.content-box').offsetWidth @@ -1415,13 +1486,16 @@ window.qiankunActions.onGlobalStateChange((state, prev) => { console.log('鐖跺眰state鍙樺寲', state) window.qiankunState = state - - if (window.qiankunState && window.qiankunState.initTestBook) { - window.qiankunState.initTestBook( - localStorage.getItem('bookId') + '', - localStorage.getItem('tryPageCount') - ) + if (isBuy.value) { + if (window.qiankunState && window.qiankunState.initTestBook) { + window.qiankunState.initTestBook(localStorage.getItem('bookId') + '') + } + } else { + if (window.qiankunState && window.qiankunState.initTestBook) { + window.qiankunState.initTestBook(localStorage.getItem('bookId') + '', tryPageCount.value) + } } + }) // 瀹氫箟鐖跺眰鏂规硶 @@ -1511,6 +1585,7 @@ // if (window.qiankunState && window.qiankunState.getAnswers){ // window.qiankunState.getAnswers(localStorage.getItem("")) // } + }) onBeforeUnmount(() => { @@ -1532,6 +1607,44 @@ // } // } // ) + +//鏍规嵁refcode鑾峰彇鍥句功淇℃伅 + +const getBookInfo = () => { + const obj = { + storeInfo: 'jsek_digitalTextbooks', + path: '*', + queryType: '*', + coverSize: { + width: 150 + }, + paging: { + start: 0, + size: 6 + }, + filterList: [ + { + value: 'Normal', + field: 'state' + } + ], + fields: { + author: [], + RefCodes: [localStorage.getItem('bookId')], + probationPage: [] + } + } + MG.store.getProductList(obj).then((res) => { + console.log(res.datas, '鍥句功淇℃伅') + bookInfo.value = res.datas[0] + if (res.datas[0].purchasedSaleMethodIdList.includes(res.datas[0].defaultSaleMethodId)) { + isBuy.value = true + } else { + isBuy.value = false + } + tryPageCount.value = Number(res.datas[0].probationPage) + }) +} const getUserInfo = () => { MG.identity.getCurrentAppUser().then((res) => { @@ -1701,6 +1814,7 @@ icon: huabi, name: '鐢荤瑪', isShow: bookConfig.value.textbookComponents.indexOf('800109C0') > -1 + // isShow: true }, { icon: baiban, @@ -1782,10 +1896,20 @@ catalogueData.value = json.data headerData.totlePage = json.data[json.data.length - 1].end listLoading.value = false + if (localStorage.getItem('chapter') && localStorage.getItem('startPage')) { + let chapter = Number(localStorage.getItem('chapter')) + let start = Number(localStorage.getItem('startPage')) + + if (window.qiankunState && window.qiankunState.gotoPage) { + window.qiankunState.gotoPage(chapter,start) + localStorage.removeItem('chapter') + localStorage.removeItem('startPage') + } + } }) .catch(function (error) { listLoading.value = false - console.log(error) + }) } const defaultProps = { @@ -1800,9 +1924,8 @@ } const handleNodeClick = (data) => { - console.log(data) - if (localStorage.getItem('tryPageCount')) { - if (data.start < localStorage.getItem('tryPageCount')) { + if (!isBuy.value) { + if (data.start < tryPageCount.value) { headerData.process = data.start if (window.qiankunState && window.qiankunState.gotoPage) window.qiankunState.gotoPage(data.chapter, data.start) @@ -1940,6 +2063,11 @@ if (resItem1.resourceType == classifySelectList.value[0].title) { resourceDataList.value.push(resItem1) } + if(activeClassify.value == 'other'){ + if (resItem1.resourceType != '鍥剧墖' && resItem1.resourceType != '瑙嗛' && resItem1.resourceType != '闊抽') { + resourceDataList.value.push(resItem1) + } + } }) } } else { @@ -2014,6 +2142,11 @@ if (resItem1.resourceType == classifySelectList.value[0].title) { resourceDataList.value.push(resItem1) } + if(activeClassify.value == 'other'){ + if (resItem1.resourceType != '鍥剧墖' && resItem1.resourceType != '瑙嗛' && resItem1.resourceType != '闊抽') { + resourceDataList.value.push(resItem1) + } + } }) } } @@ -2046,7 +2179,10 @@ } } //璧勬簮鎾斁瑙嗛 +const sceneUrl = ref() +const showData = ref() const goPlay = (data, index) => { + console.log(data.resourceType,123) resourType.value = data.resourceType if (data.resourceType == '瑙嗛') { if (data.md5) { @@ -2063,7 +2199,54 @@ testAudio.value = bookConfig.value.resourceUrl + '/' + data.resourcePath } autoPlay() - } else { + } else if (data.resourceType == '妯″瀷') { + console.log(data,222) + let file = bookConfig.value.requestCtx + '/file/api/ApiDownload?md5=' + data.md5 + console.log(file.exd,777) + const ctx = 'https://jsek.bnuic.com' + if (data.md5) { + sceneUrl.value = 'https://jsek.bnuic.com/books/book/civilAviation/static/modelView/index.html?md5=' + data.md5 + '&name=je' + '&domain=' + ctx + '&exd=obj' + '&target=iframe' + } else { + sceneUrl.value = bookConfig.value.resourceUrl + '/' + data.resourcePath + } + modelToolVisble.value = true + // if (data.md5) { + // window.open(bookConfig.value.requestCtx + '/file/api/ApiDownload?md5=' + data.md5) + // } else if (data.resourcePath) { + // window.open(bookConfig.value.resourceUrl + '/' + data.resourcePath) + // } + }else if(data.resourceType == 'PPT' || data.resourceType == 'PDF'){ + let md5 = data.md5 + let dataList = [] + MG.file + .getPdfInfo({ + md5 + }) + .then((res: any) => { + console.log() + if (res && res.totalPages) { + for (let i = 0; i < res.totalPages; i++) { + const src = + bookConfig.value.requestCtx + + '/file/GetPdfPageImage?md5=' + + md5 + + '&index=' + + (i + 1) + + '&dpi=300' + dataList.push({ + showSrc: src + }) + } + console.log(dataList) + showData.value = dataList + // 鍚姩椤电爜瑙傚療 + setTimeout(() => { + resourVisble.value = true + }, 500) + } + }) + + }else { if (data.md5) { window.open(bookConfig.value.requestCtx + '/file/api/ApiDownload?md5=' + data.md5) } else if (data.resourcePath) { @@ -2074,6 +2257,13 @@ // else if (data.resourceType == 'word') { // testWord.value = bookConfig.value.resourceUrl + '/' + data.resourcePath // } +} +const goDownload =(data) =>{ + if (data.md5) { + window.open(bookConfig.value.requestCtx + '/file/api/ApiDownload?md5=' + data.md5) + } else if (data.resourcePath) { + window.open(bookConfig.value.resourceUrl + '/' + data.resourcePath) + } } // 鍏抽棴瑙嗛 const resourVisbleClose = () => { @@ -2101,6 +2291,9 @@ //璧勬簮绫诲瀷閫夋嫨榛樿/鏁欏笀 const selectResourceType = (type) => { resourceType.value = type + resourceDataList.value = [] + classifySelectList.value = [] + activeClassify.value = '' searchText.value = '' if (type == 'collect') { getCollectResource() @@ -2113,12 +2306,11 @@ activeClassify.value = item.key resourceDataList.value = [] searchText.value = '' - if(resourceType.value == 'collect') { + if (resourceType.value == 'collect') { getCollectResource() } else { getResourceData() } - } const searchBtn = () => { if (searchShow.value) { @@ -2130,17 +2322,17 @@ // 鑾峰彇鏀惰棌鐨勮祫婧� const getCollectResource = () => { - if(token) { + if (token) { MG.identity - .getUserKey({ - domain: 'collectResource', - keys: [bookConfig.value.bookId] - }) - .then((res) => { - if (res.length) { - collectResourceList.value = JSON.parse(res[0].value) - console.log('鏀惰棌璧勬簮鍒楄〃', collectResourceList.value) - if(collectResourceList.value.length > 0) { + .getUserKey({ + domain: 'collectResource', + keys: [bookConfig.value.bookId] + }) + .then((res) => { + if (res.length) { + collectResourceList.value = JSON.parse(res[0].value) + console.log('鏀惰棌璧勬簮鍒楄〃', collectResourceList.value) + if (collectResourceList.value.length > 0) { let imgCount = 0 let audioCount = 0 let videoCount = 0 @@ -2213,13 +2405,18 @@ if (resItem1.resourceType == classifySelectList.value[0].title) { resourceDataList.value.push(resItem1) } + if(activeClassify.value == 'other'){ + if (resItem1.resourceType != '鍥剧墖' && resItem1.resourceType != '瑙嗛' && resItem1.resourceType != '闊抽') { + resourceDataList.value.push(resItem1) + } + } }) } + } + } else { + resourceDataList.value = [] } - } else { - resourceDataList.value = [] - } - }) + }) } else { ElMessageBox.confirm('璇峰厛鐧诲綍锛�', { confirmButtonText: '鍘荤櫥褰�', @@ -2240,27 +2437,27 @@ } } // 鏀惰棌鎸夐挳 -const handleCollectResource = (id,md5,resourcePath,resourceType,source,resourceName) => { - if(collectResourceList.value.findIndex(item => item.id == id) > -1) { - collectResourceList.value = collectResourceList.value.filter(item => item.id != id) - } else { - collectResourceList.value.push({ - id, - md5, - resourcePath:resourcePath.replace(bookConfig.value.resourceUrl + '/',''), - resourceType, - source, - resourceName - }) - } - MG.identity.setUserKey({ +const handleCollectResource = (id, md5, resourcePath, resourceType, source, resourceName) => { + if (collectResourceList.value.findIndex((item) => item.id == id) > -1) { + collectResourceList.value = collectResourceList.value.filter((item) => item.id != id) + } else { + collectResourceList.value.push({ + id, + md5, + resourcePath: resourcePath.replace(bookConfig.value.resourceUrl + '/', ''), + resourceType, + source, + resourceName + }) + } + MG.identity.setUserKey({ setKeyRequests: [ { - domain: "collectResource", - key:bookConfig.value.bookId, - value: JSON.stringify(collectResourceList.value), - }, - ], + domain: 'collectResource', + key: bookConfig.value.bookId, + value: JSON.stringify(collectResourceList.value) + } + ] }) } @@ -2357,15 +2554,14 @@ //閿欓鏈� const wrongQuestionVisble = ref(false) const selectExercisesType = (type) => { - if (type == 'exercises') { getExercisesList() - exercisesType.value = type - searchText.value = '' + exercisesType.value = type + searchText.value = '' } else if (type == 'additional') { getAdditionalList() - exercisesType.value = type - searchText.value = '' + exercisesType.value = type + searchText.value = '' } else if (type == 'wrong') { openExaminationDialog(true, {}, 'errorQuestion') } else { @@ -2446,7 +2642,6 @@ // } } -const searchText = ref<string>('') //绛涢�� const menuState = reactive({ open: true, notesColor: 'all' //绗旇棰滆壊 @@ -2707,6 +2902,7 @@ const functionVisible = ref(false) const siweiVisble = ref(false) const modelToolVisble = ref(false) +const modelTool = ref(false) const shengciVisble = ref(false) const calculatorVisble = ref(false) const activeTool = ref(0) @@ -2729,7 +2925,7 @@ siweiVisble.value = true break case '妯″瀷宸ュ叿': - modelToolVisble.value = true + modelTool.value = true break case '璇嶅吀': cidianVisible.value = true @@ -2739,8 +2935,8 @@ shengciVisble.value = true break case '璁$畻鍣�': - calculatorVisble.value = true - break + calculatorVisble.value = true + break } } else { ElMessageBox.confirm('璇峰厛鐧诲綍锛�', { @@ -2818,7 +3014,6 @@ //娴獥宸ュ叿鏍忕偣鍑讳簨浠� const floatItemHandle = (item) => { - console.log(floatingToolData.activeToolData, 'floatingToolData.activeToolData') if (floatingToolData.activeToolData == '鐢荤瑪') { floatingToolData.activeToolData = '' } else { @@ -3055,7 +3250,6 @@ //璺宠浆 const goReMark = (item) => { - console.log(item) if (window.qiankunState && window.qiankunState.gotoPage) { window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page)) } @@ -3140,7 +3334,6 @@ } //鍙栨秷鍥炶皟 const closeFn = (base64: any) => { - console.log(base64) floatingToolData.activeToolData = '' } //淇濆瓨鎴浘 @@ -3387,7 +3580,6 @@ window.speechSynthesis.cancel() const synth = window.speechSynthesis const utterance = new SpeechSynthesisUtterance(dialogToolData.txt) - console.log(utterance, 1) utterance.lang = 'zh-CN' // 璁剧疆璇█涓轰腑鏂� synth.speak(utterance) showToolBox.value = false @@ -3424,10 +3616,8 @@ showToolBox.value = false // cidianVisible.value = true - console.log(dialogToolData.txt) break case '鐧剧': - console.log('https://baike.baidu.com/item/' + dialogToolData.txt) baiduVisible.value = true break } @@ -3668,7 +3858,6 @@ const item = res[i] // 鍌ㄥ�� let data = catalogueData.value.find((item1) => item1.chapter == Number(item.key)) - // console.log(data,'666') let dataList = [] if (catalogueData.value.length > 0) { catalogueData.value.forEach((item1) => { @@ -3710,7 +3899,6 @@ }) } } - console.log(scribeData.noteList, 'scribeData.noteList') } listLoading.value = false }) @@ -3784,13 +3972,11 @@ document.addEventListener('mousemove', function (event) { var x = event.offsetX var y = event.offsetY - // console.log('榧犳爣鍧愭爣浣嶇疆锛�', x, y) noteContent.top = event.clientY + 20 noteContent.left = event.clientX }) } window.noteOut = (type) => { - console.log(type, 123) noteContent.show = false } @@ -3840,7 +4026,6 @@ //绗旇璺宠浆 const jumpContent = (item) => { - console.log(item) if (window.qiankunState && window.qiankunState.gotoPage) { window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page)) } @@ -3848,7 +4033,6 @@ //鑿滃崟绗旇缂栬緫 const update = (item) => { - console.log(item) dialogToolData.chapter = item.chapterNum noteColorActive.value = item.color formData.id = item.id @@ -3931,13 +4115,11 @@ } ]) .then((res) => { - console.log(res[0][0], 'cid') if (res.length > 0 && res[0].length > 0) { res[0].map((item) => { item.trans = JSON.parse(item.trans) }) dictionaryData.data = res[0][0] - console.log(dictionaryData.data, '14') dictionaryData.showContent = true } }) @@ -4028,6 +4210,11 @@ }) } } + +const formulaDialog = ref(false) +const openFormulaDialog = () => { + formulaDialog.value = true +} </script> <style lang="less"> @@ -4049,15 +4236,18 @@ display: flex; justify-content: space-between; align-items: center; + .logoTxt { font-size: 24px; color: #333; letter-spacing: 2px; font-weight: bold; } + .userInfoBox { display: flex; align-items: center; + .userName { font-size: 18px; margin-right: 15px; @@ -4065,6 +4255,7 @@ border-right: 1px solid #e0e0e0; color: #2c2c2c; } + .layout { width: 69px; height: 30px; @@ -4076,11 +4267,13 @@ } } } + .contentBox { overflow: hidden; flex: 1; display: flex; position: relative; + .menuBox { width: 80px; flex-shrink: 0; @@ -4103,30 +4296,36 @@ width: 63px; margin: 10px auto; border-radius: 10px; + &.active, &:hover { background-color: rgba(0, 147, 255, 0.1); + p { color: #0093ff; } } + .menuIcon { display: inline-block; width: 32px; height: 32px; } + .name { text-align: center; line-height: 1; color: #2c3e50; } } + .reload { width: 80px; position: absolute; bottom: 100px; text-align: center; } + .setting { width: 80px; position: absolute; @@ -4134,6 +4333,7 @@ text-align: center; } } + .menuContent { // position: relative; width: 300px; @@ -4144,6 +4344,7 @@ -moz-user-select: none; -khtml-user-select: none; user-select: none; + .searchBox { width: 100%; height: 60px; @@ -4153,22 +4354,27 @@ align-items: center; border-bottom: 1px solid #efefef; } + .resourceSearchBox { padding: 10px 0; margin: 0 20px; border-bottom: 1px solid rgba(204, 204, 204, 0.32); + .classification { width: 100%; display: flex; justify-content: space-between; align-items: center; + .flex1 { flex: 1; text-align: center; } + .title { color: #999999; } + .count { width: 35px; margin: 0 auto; @@ -4179,16 +4385,19 @@ height: 18px; font-size: 12px; } + .activeClassify, .classifyItem:hover { .title { color: #0093ff; } + .count { background: #0093ff; color: #fff; } } + .showSearch { .imgBox { width: 39px; @@ -4196,17 +4405,20 @@ border-radius: 16px; margin: 0 auto; } + .imgBox:hover, .activeSearch { border: 1px solid #0093ff; } } } + .inputBox { margin-top: 10px; width: 100% !important; } } + .resourceTab { width: 100%; height: 60px; @@ -4214,18 +4426,22 @@ justify-content: center; align-items: center; font-size: 16px; + .hr { height: 25px; color: #dbdbdb !important; } + .tabItem:first-child(1) { border-right: 1px solid #707070; } + .tabItem { flex: 1; text-align: center; line-height: 57px; } + .text { width: 43px; height: 3px; @@ -4233,12 +4449,15 @@ background: #0093ff; border-radius: 3px 3px 0px 0px; } + .line { height: 3px; } } + .inputBox { width: 85%; + .custom-input { border: 1px solid #0093ff !important; border-radius: 50px; @@ -4250,19 +4469,23 @@ .is-focus, .el-input__wrapper { box-shadow: none !important; + .el-input__inner { border: none !important; height: 34px !important; } } + .el-input-group__append { padding: 0 10px !important; background: none !important; } } + .screenBox { display: flex; padding: 0 10px; + .title { margin: 10px 0; line-height: 40px; @@ -4313,14 +4536,17 @@ border: 1px solid #0093ff; } } + .menuList { height: calc(100% - 60px); overflow-y: auto; padding: 10px 0; } + .list-box { .resourceList { padding: 10px; + .resourceItem { padding: 10px 0; align-items: center; @@ -4335,11 +4561,13 @@ align-items: center; justify-content: center; position: relative; + img { height: 100%; width: 100%; object-fit: contain; } + .handleBox { position: absolute; top: 0; @@ -4349,11 +4577,13 @@ background: rgba(44, 44, 44, 0.6); text-align: center; padding: 2px; + .delImg { height: 100%; display: flex; align-items: center; justify-content: center; + .icon { position: static; margin: 5px; @@ -4369,21 +4599,25 @@ } } } + .screenshot { padding: 20px; display: flex; flex-wrap: wrap; justify-content: space-between; + .captureItem { margin-bottom: 10px; width: 46%; position: relative; + .imgBox { border: 1px solid #d8d8d8; width: 100%; height: 80px; margin-bottom: 5px; } + .deleteBox { position: absolute; top: 0; @@ -4393,11 +4627,13 @@ background: rgba(44, 44, 44, 0.6); text-align: center; padding: 2px; + .delImg { height: 100%; display: flex; align-items: center; justify-content: center; + .icon { position: static; margin: 5px; @@ -4405,6 +4641,7 @@ } } } + // .capture { // width: 100%; // } @@ -4428,22 +4665,26 @@ background: #fff; border-radius: 5px; padding: 10px 0; + .textBox { .title { display: flex; justify-content: space-between; align-items: center; margin-right: 10px; + .border-left { height: 25px; border-right: 4px solid; border-radius: 0 5px 5px 0; margin-right: 10px; } + .title-con { display: flex; align-items: center; color: #949494; + .round { width: 10px; height: 10px; @@ -4456,6 +4697,7 @@ margin-left: 5px; } } + .chapter { color: #b7b7b7; margin: 5px 5px 5px 14px; @@ -4468,10 +4710,12 @@ padding: 0 5px; } } + .noteText { margin: 10px 10px 10px 15px; border-radius: 3px; padding: 2px 5px; + .con { max-height: 65px; display: -webkit-box; @@ -4481,14 +4725,17 @@ } } } + .chapterName { margin: 15px; display: flex; align-items: center; + span { margin-left: 5px; } } + .reMarkItem { margin: 15px; background: #fff; @@ -4496,8 +4743,10 @@ padding: 10px; display: flex; justify-content: space-between; + .reMarkCon { display: flex; + .con { width: 200px; white-space: nowrap; @@ -4506,10 +4755,12 @@ margin-right: 8px; } } + .deleteReMarkImg { display: flex; align-items: center; } + .questionCon { width: 240px; white-space: nowrap; @@ -4525,10 +4776,12 @@ border-radius: 10px; padding: 10px; display: flex; + .index { line-height: 24px; margin-right: 10px; } + .searchCon { flex: 1; width: 240px; @@ -4540,6 +4793,7 @@ -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; + .searchColor { background: rgb(245, 225, 42, 0.5); } @@ -4547,6 +4801,7 @@ } } } + .allSearch, .notesBox, .resourceBox, @@ -4556,30 +4811,33 @@ height: calc(100% - 60px); overflow-y: auto; } + .questionList { - height:83% + height: 83%; } + .question-bottom { position: absolute; bottom: 0; display: flex; justify-content: space-evenly; - width:300px; - padding:20px 0; - background-color:#fff; + width: 300px; + padding: 20px 0; + background-color: #fff; li { cursor: pointer; width: 65px; - height:65px; - border:1px solid #cfcfcf; - border-radius:10px; - background-color:#f9f9f9; - display:flex; + height: 65px; + border: 1px solid #cfcfcf; + border-radius: 10px; + background-color: #f9f9f9; + display: flex; justify-content: center; align-items: center; } } } + .menuStateBox { width: 25px; height: 25px; @@ -4591,6 +4849,7 @@ text-align: center; box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3); z-index: 2; + img { height: 10px; width: 18px; @@ -4601,6 +4860,7 @@ flex: 1; font-size: 16px; position: relative; + .pageBox-header { height: 57px; padding: 0 20px; @@ -4609,6 +4869,7 @@ z-index: 99; align-items: center; justify-content: space-between; + .classTime { display: flex; align-items: center; @@ -4616,6 +4877,7 @@ border-radius: 20px 20px 20px 20px; color: #0093ff; padding: 8px; + .qureIcon { width: 9px; height: 9px; @@ -4624,16 +4886,20 @@ margin: 0 5px; } } + .progress { text-align: center; + .bookName { font-weight: 800; margin-bottom: 5px; color: #333; } } + .rightBox { display: flex; + .pageSizeBox { display: flex; align-items: center; @@ -4643,21 +4909,25 @@ padding: 5px; display: flex; align-items: center; + img { width: 18px; height: 18px; } } } + .brushImgBox { display: flex; align-items: center; border-left: 1px solid #d8d8d8; + div { padding: 5px; display: flex; align-items: center; } + .brushImg { width: 22px; margin-left: 20px; @@ -4666,21 +4936,26 @@ } } } + .pageBox-content { height: calc(100% - 57px); background: #fbf9f4; padding: 10px 0; + .content-box { height: 100%; position: relative; + #container { background: #fbf9f4; height: 100%; + #__qiankun_microapp_wrapper_for_app_content__ { height: 100%; } } } + .canvas-box { height: 100%; width: 100%; @@ -4692,6 +4967,7 @@ } } } + .toolBox { position: relative; box-shadow: -3px 0px 6px 1px rgba(0, 0, 0, 0.07); @@ -4700,11 +4976,13 @@ -moz-user-select: none; -khtml-user-select: none; user-select: none; + .toolTitle { height: 57px; line-height: 53px; text-align: center; border-bottom: 1px solid #efefef; + .text { width: 43px; height: 3px; @@ -4713,8 +4991,10 @@ border-radius: 3px 3px 0px 0px; } } + .menu { padding-top: 20px; + li > div { // height: 50px; padding: 10px 36px; @@ -4734,6 +5014,7 @@ } } } + .openBox { width: 25px; height: 25px; @@ -4752,22 +5033,27 @@ width: 18px; } } + .right { right: 198px !important; border-radius: 0px 3px 3px 0px !important; } + .classRoomBox { position: absolute; bottom: 0; width: 100%; + .el-tabs__nav { width: 100% !important; } + .el-tabs__item { flex: 1 !important; padding: 0 !important; text-align: center; } + .el-tabs__active-bar { width: 43px !important; left: 30px !important; @@ -4775,13 +5061,16 @@ bottom: 1px; border-radius: 3px 3px 0px 0px; } + .tabBox { height: 100px; padding: 10px 17px; text-align: center; + .insertSelect { display: flex; justify-content: space-between; + .selectItem { text-align: center; background: rgba(207, 207, 207, 0.13); @@ -4789,6 +5078,7 @@ border-radius: 5px; border: 2px solid #cfcfcf; } + .typeActive { text-align: center; color: #0093ff; @@ -4798,6 +5088,7 @@ background: rgba(0, 147, 255, 0.13); } } + .giveLessons { color: #0093ff; width: 90px; @@ -4808,6 +5099,7 @@ display: flex; align-items: center; justify-content: center; + span { margin-left: 10px; } @@ -4828,6 +5120,7 @@ border-radius: 10px; padding: 6px; overflow: hidden; + .floatToolItem { margin: 10px 0; height: 30px; @@ -4837,11 +5130,13 @@ border-radius: 5px; color: #fff; cursor: pointer; + .imgBox { width: 24px; height: 24px; margin: 0 auto; position: relative; + img { width: 100%; height: 100%; @@ -4857,10 +5152,12 @@ margin: auto; } } + .text { margin-right: 5px; } } + .floatToolItem:hover, .floatToolActive { background-color: rgba(255, 255, 255, 0.3); @@ -4879,10 +5176,12 @@ background: #fff; overflow: hidden; box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3); + .toolList { display: flex; justify-content: center; align-items: center; + .floatToolItem { margin: 6px 8px; padding: 5px; @@ -4893,6 +5192,7 @@ align-items: center; // flex: 1; font-size: 14px; + .imgBox { height: 18px; width: 18px; @@ -4900,9 +5200,11 @@ margin: 0 auto; } } + .floatToolItem:hover { background-color: rgba(44, 44, 44, 0.2); } + .layOutTool { height: 20px; margin-right: 5px; @@ -4914,6 +5216,7 @@ .dialogToolBox { position: fixed; z-index: 2; + .toolSelectBox { height: 40px; display: flex; @@ -4923,6 +5226,7 @@ overflow: hidden; padding: 5px; background-color: rgba(90, 90, 90, 0.9); + // background-image: linear-gradient(to right, #0093ff, #005dff); .dialogToolItem { user-select: none; @@ -4933,10 +5237,12 @@ margin: 0 5px; cursor: pointer; text-align: center; + span { color: #fff; } } + .dialogToolItem:hover, .active { background-color: rgba(255, 255, 255, 0.2); @@ -4946,6 +5252,7 @@ } } } + .colorSelectBox { padding: 5px 10px; width: 190px; @@ -4955,8 +5262,10 @@ box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.16); border-radius: 5px; margin-bottom: 10px; + .flex1 { flex: 1; + .scribeItem { width: 18px; height: 18px; @@ -4971,6 +5280,7 @@ } } } + .lineDeleteBox { position: fixed; z-index: 2; @@ -4980,6 +5290,7 @@ background-color: rgba(90, 90, 90, 0.9); border-radius: 5px; display: flex; + .dialogToolItem { padding: 3px; margin: 0 5px; @@ -4988,10 +5299,12 @@ justify-content: center; align-items: center; } + .dialogToolItem:hover { background-color: rgba(255, 255, 255, 0.3); } } + .noteContentBox { max-width: 240px; position: fixed; @@ -4999,6 +5312,7 @@ padding: 10px; border-radius: 5px; } + .dictionaryDataBox { position: fixed; z-index: 2; @@ -5006,9 +5320,11 @@ padding: 5px 20px; background: #fff; border-radius: 5px; + .word { font-weight: bold; } + .phone_con { .per-phone { align-items: center; @@ -5022,33 +5338,40 @@ margin-right: 10px; margin-top: 10px; padding: 8px 10px; + span { margin: 0 10px; flex: 1; } } + .soundBtn { width: 16px; height: 14px; } } + .trans { padding: 20px 0; + .itemList { display: flex; padding: 10px 0; + .index { margin-right: 15px; } + .pos { margin-right: 30px; } } } } + .wendabox { width: 100%; - height: 80vh; + height: 82vh; iframe { width: 100%; @@ -5080,38 +5403,48 @@ top: 0px !important; right: 0px !important; } + .el-dialog__body { padding: 20px !important; } + .el-dialog__footer { padding: 10px 20px 20px !important; text-align: right; box-sizing: border-box; } } + .myDialogs { height: 90vh; } + .myAnserDialogs { width: 700px; height: 90vh; } + .myNoteDialogs { width: 500px !important; } + .screenshotDialog { width: 400px !important; } + .baiduDialog { width: 90vw; height: 90vh; } + .noteColorSelectBox { margin-top: 10px; width: 190px; display: flex; + .flex1 { flex: 1; + .scribeItem { width: 18px; height: 18px; @@ -5124,29 +5457,50 @@ } } } + .videoBox { text-align: center; + video { width: 100%; } } + .audioBox { // display:none; } .wordBox { height: 600px; + width: 100%; + overflow-y: scroll; + + img { + display: block; + margin: 0 auto; + width: 90%; + height: auto; + box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.1); + object-fit: contain; + } } + .imgUrlBox { width: 100%; text-align: center; + img { width: 100%; } } + .voice-reader { - position:absolute; - bottom:30px; - left:50px; + position: absolute; + bottom: 30px; + left: 50px; +} +.iframe-box { + width:100%; + height: 800px; } </style> -- Gitblit v1.9.1