From d7e53e63dd6c435e226d9f08cde31ca35131c911 Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期一, 14 四月 2025 15:30:33 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TextbookReader --- src/views/readerPages/webHome.vue | 1351 ++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 1,068 insertions(+), 283 deletions(-) diff --git a/src/views/readerPages/webHome.vue b/src/views/readerPages/webHome.vue index 0b14be8..2c9cb33 100644 --- a/src/views/readerPages/webHome.vue +++ b/src/views/readerPages/webHome.vue @@ -12,14 +12,20 @@ <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"> <!-- 鑿滃崟 --> <div class="menuBox"> <div v-for="(item, index) in menuData" :key="index"> - <div :class="['menuItem', activeMenu == item.name ? 'active' : '']" @click="menuItemClick(item.name)" - v-if="item.isShow"> + <div + :class="['menuItem', activeMenu == item.name ? 'active' : '']" + @click="menuItemClick(item.name)" + v-if="item.isShow" + > <div class="menuIcon imgBox"> <img :src="item.icon" /> </div> @@ -34,10 +40,16 @@ <el-form-item label="瀛椾綋澶у皬"> <div class="lineStyle"> <div class="lineTypeBox"> - <div v-for="item in settingForm.fontSizeList" :key="item.key" :class="settingForm.fontSizeActive == item.key - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="fontSizeSelect(item)"> + <div + v-for="item in settingForm.fontSizeList" + :key="item.key" + :class=" + settingForm.fontSizeActive == item.key + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="fontSizeSelect(item)" + > {{ item.lable }} <div class="activeIcon" v-if="settingForm.fontSizeActive == item.key"> <img :src="xuanzhong" /> @@ -56,13 +68,20 @@ </div> --> <el-form-item label="搴曡壊"> <div class="bgColor"> - <div v-for="item in settingForm.bgColorList" :key="item.key" class="flex1 hover" - @click="bgColorSelect(item)"> - <div :style="{ - background: item.key, - 'border-color': - item.key == settingForm.bgColorActive ? '#0093FF' : '#EBEBEB' - }" class="scribeItem"> + <div + v-for="item in settingForm.bgColorList" + :key="item.key" + class="flex1 hover" + @click="bgColorSelect(item)" + > + <div + :style="{ + background: item.key, + 'border-color': + item.key == settingForm.bgColorActive ? '#0093FF' : '#EBEBEB' + }" + class="scribeItem" + > <img :src="xuanzhong1" v-if="item.key == settingForm.bgColorActive" /> </div> </div> @@ -82,8 +101,14 @@ <div class="menuContent" v-if="menuState.open"> <div class="searchBox"> <div class="inputBox" v-if="activeMenu !== '璧勬簮' && activeMenu !== '棰樺簱'"> - <el-input class="custom-input" placeholder="璇疯緭鍏ュ唴瀹�" v-model="searchText" @keyup.enter="searchBook" clearable - @clear="handleClear"> + <el-input + class="custom-input" + placeholder="璇疯緭鍏ュ唴瀹�" + v-model="searchText" + @keyup.enter="searchBook" + clearable + @clear="handleClear" + > <template #prefix> <img :src="listSearch" @click="searchBook" class="hover" /> </template> @@ -94,8 +119,8 @@ <div>榛樿璧勬簮</div> <div :class="resourceType == 'default' ? 'text' : 'line'"></div> </div> - <hr class="hr" /> - <div class="tabItem hover" @click="selectResourceType('teacher')"> + <hr class="hr" v-if="userInfo.role == 'Teacher'"/> + <div class="tabItem hover" @click="selectResourceType('teacher')" v-if="userInfo.role == 'Teacher'"> <div>鏁欏笀璧勬簮</div> <div :class="resourceType == 'teacher' ? 'text' : 'line'"></div> </div> @@ -106,14 +131,20 @@ </div> </div> <div v-if="activeMenu == '棰樺簱'" class="resourceTab"> - <div class="tabItem hover" @click="selectExercisesType('exercises')" - v-if="bookConfig.textbookComponents.indexOf('3D3B4F55') > -1"> + <div + class="tabItem hover" + @click="selectExercisesType('exercises')" + v-if="bookConfig.textbookComponents.indexOf('3D3B4F55') > -1" + > <div>涔犻</div> <div :class="exercisesType == 'exercises' ? 'text' : 'line'"></div> </div> <hr class="hr" v-if="bookConfig.textbookComponents.indexOf('A4821F71') > -1" /> - <div class="tabItem hover" @click="selectExercisesType('additional')" - v-if="bookConfig.textbookComponents.indexOf('A4821F71') > -1"> + <div + class="tabItem hover" + @click="selectExercisesType('additional')" + v-if="bookConfig.textbookComponents.indexOf('A4821F71') > -1" + > <div>闄勫姞棰�</div> <div :class="exercisesType == 'additional' ? 'text' : 'line'"></div> </div> @@ -139,9 +170,18 @@ </div> <!-- 鐩綍 --> <div class="menuList" v-if="activeMenu == '鐩綍'" v-loading="listLoading"> - <el-tree ref="catalogTree" default-expand-all="true" :expand-on-click-node="false" node-key="start" - highlight-current :data="catalogueData" :props="defaultProps" v-if="catalogueData.length > 0" - @node-click="handleNodeClick" :filter-node-method="filterNode"> + <el-tree + ref="catalogTree" + default-expand-all="true" + :expand-on-click-node="false" + node-key="start" + highlight-current + :data="catalogueData" + :props="defaultProps" + v-if="catalogueData.length > 0" + @node-click="handleNodeClick" + :filter-node-method="filterNode" + > <template #default="{ node, data }"> <div class="custom-tree-node"> <div class="catalogueLabel" :title="node.label">{{ node.label }}</div> @@ -159,8 +199,11 @@ <div v-if="allSearchReault.length > 0" class="allSearchList"> <div v-for="(reault, index) in allSearchReault" :key="index"> <div class="chapterName"> - <el-icon @click="searchClose(index)" - v-if="searchReaultData.isShow && searchReaultData.openIndex == index" class="hover"> + <el-icon + @click="searchClose(index)" + v-if="searchReaultData.isShow && searchReaultData.openIndex == index" + class="hover" + > <ArrowDown /> </el-icon> <el-icon @click="searchOpen(index)" v-else class="hover"> @@ -168,11 +211,19 @@ </el-icon> <span>{{ reault.chapterName }} 锛坽{ reault.itemList.length }}锛�</span> </div> - <div v-for="(item, index1) in reault.itemList" :key="index1" class="searchItem" - v-show="searchReaultData.isShow && searchReaultData.openIndex == index"> + <div + v-for="(item, index1) in reault.itemList" + :key="index1" + class="searchItem" + v-show="searchReaultData.isShow && searchReaultData.openIndex == index" + > <div class="index">{{ index1 + 1 }}.</div> - <div class="searchCon hover" @click="goSearchContent(item)" v-html="item.txt1" :title="item.txt"> - </div> + <div + class="searchCon hover" + @click="goSearchContent(item)" + v-html="item.txt1" + :title="item.txt" + ></div> </div> </div> </div> @@ -188,17 +239,27 @@ <div class="flex1 hover" @click="searchClick('all')"> <div :class="menuState.notesColor == 'all' ? ' allActive' : 'all'">鍏ㄩ儴</div> </div> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" @click="searchClick(item)"> - <div :style="{ background: item.key }" - :class="item.key == menuState.notesColor ? 'activeScribe scribeItem' : 'scribeItem'"></div> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="searchClick(item)" + > + <div + :style="{ background: item.key }" + :class="item.key == menuState.notesColor ? 'activeScribe scribeItem' : 'scribeItem'" + ></div> </div> </div> <div class="list-box"> <div v-if="scribeData.noteList.length > 0"> <div v-for="(noteItem, index) in scribeData.noteList" :key="noteItem"> <div class="chapterName"> - <el-icon @click="noteClose(index)" v-if="scribeData.isShow && scribeData.openIndex == index" - class="hover"> + <el-icon + @click="noteClose(index)" + v-if="scribeData.isShow && scribeData.openIndex == index" + class="hover" + > <ArrowDown /> </el-icon> <el-icon @click="noteOpen(index)" v-else class="hover"> @@ -206,12 +267,19 @@ </el-icon> <span>{{ noteItem.chapterName }}</span> </div> - <div v-for="(item, index1) in noteItem.noteList" :key="item.key" class="listItem" - v-show="scribeData.isShow && scribeData.openIndex == index"> + <div + v-for="(item, index1) in noteItem.noteList" + :key="item.key" + class="listItem" + v-show="scribeData.isShow && scribeData.openIndex == index" + > <div class="textBox"> <div class="title"> <div class="title-con"> - <div class="border-left" :style="{ 'border-right-color': item.color }"></div> + <div + class="border-left" + :style="{ 'border-right-color': item.color }" + ></div> <span>{{ moment(item.createDate).format('YYYY-MM-DD') }}</span> </div> <div> @@ -219,20 +287,24 @@ <img :src="shanchu" @click="deleteBtn(item)" class="hover" /> </div> </div> - <div class="noteText hover 123456" @click="jumpContent(item)" :style="{ - background: - item.color == '#F5E12A' - ? 'rgba(255,234,41,0.1)' - : item.color == '#76F0AE' - ? 'rgba(83,255,162,0.1)' - : item.color == '#59CFF5' - ? 'rgba(93,216,255,0.1)' - : item.color == '#CAA5FC' - ? 'rgba(205,167,255,0.1)' - : item.color == '#F5A0B9' - ? 'rgba(255,167,193,0.1)' - : item.color - }"> + <div + class="noteText hover 123456" + @click="jumpContent(item)" + :style="{ + background: + item.color == '#F5E12A' + ? 'rgba(255,234,41,0.1)' + : item.color == '#76F0AE' + ? 'rgba(83,255,162,0.1)' + : item.color == '#59CFF5' + ? 'rgba(93,216,255,0.1)' + : item.color == '#CAA5FC' + ? 'rgba(205,167,255,0.1)' + : item.color == '#F5A0B9' + ? 'rgba(255,167,193,0.1)' + : item.color + }" + > <div class="con hover"> {{ item.note }} </div> @@ -251,9 +323,17 @@ <div class="resourceBox" v-if="activeMenu == '璧勬簮'" v-loading="listLoading"> <div class="resourceSearchBox" v-if="classifySelectList.length > 0"> <div class="classification"> - <div v-for="item in classifySelectList" :key="item.key" class="flex1 hover" @click="classifyClick(item)"> - <div :class="item.key == activeClassify ? 'activeClassify classifyItem' : 'classifyItem' - "> + <div + v-for="item in classifySelectList" + :key="item.key" + class="flex1 hover" + @click="classifyClick(item)" + > + <div + :class=" + item.key == activeClassify ? 'activeClassify classifyItem' : 'classifyItem' + " + > <div class="title">{{ item.title }}</div> <div class="count">{{ item.count }}</div> </div> @@ -265,8 +345,14 @@ </div> </div> <div class="inputBox" v-if="!searchShow"> - <el-input class="custom-input" placeholder="璇疯緭鍏ュ唴瀹�" v-model="searchText" @keyup.enter="searchBook" - clearable @clear="handleClear"> + <el-input + class="custom-input" + placeholder="璇疯緭鍏ュ唴瀹�" + v-model="searchText" + @keyup.enter="searchBook" + clearable + @clear="handleClear" + > <template #prefix> <img :src="listSearch" @click="searchBook" class="hover" /> </template> @@ -278,54 +364,118 @@ <el-row :gutter="20"> <el-col :span="12" v-for="(item, index) in resourceDataList" :key="item"> <div class="resourceItem"> - <div class="resourceImg" @mouseover="showHandle = index" @mouseleave="showHandle = null"> + <div + class="resourceImg" + @mouseover="showHandle = index" + @mouseleave="showHandle = null" + > <img :src="item.resourcePath" mode="" v-if="activeClassify == 'image'" /> - <img :src="item.icon" mode="" v-else-if="item.icon && activeClassify != 'image'" /> + <img + :src="item.icon" + mode="" + v-else-if="item.icon && activeClassify != 'image'" + /> <!-- <el-icon v-else-if="activeClassify == 'image'" size="30"></el-icon> --> <!-- <el-icon v-else-if="activeClassify == 'audio'" size="30"><Headset /></el-icon> --> <!-- <el-icon v-else-if="activeClassify == 'video'" size="30" ><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'"> + <el-icon + class="icon hover" + size="20" + @click="JumpPosition(item)" + v-if="item.pagination" + > <LocationInformation /> </el-icon> - <el-icon @click="goPlay(item)" size="20" class="icon hover" v-if="item.resourceType == '瑙嗛'"> + <el-icon + @click="goPlay(item)" + size="20" + class="icon hover" + v-if="item.resourceType == '瑙嗛'" + > <VideoPlay /> </el-icon> - <el-icon @click="goPlay(item, index)" size="20" class="icon hover" - v-if="item.resourceType == '闊抽' && playIndex != index"> + <el-icon + @click="goPlay(item, index)" + size="20" + class="icon hover" + v-if="item.resourceType == '闊抽' && playIndex != index" + > <VideoPlay /> </el-icon> - <el-icon @click="goPause()" size="20" class="icon hover" - v-if="item.resourceType == '闊抽' && playIndex == index"> + <el-icon + @click="goPause()" + size="20" + class="icon hover" + v-if="item.resourceType == '闊抽' && playIndex == index" + > <VideoPause /> </el-icon> - <el-icon @click="getCapture(item, index)" size="20" class="icon hover" - v-if="item.resourceType == '鍥剧墖'"> + <el-icon + @click="getCapture(item, index)" + size="20" + class="icon hover" + v-if="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 == '鏄�' - "> + <!-- 鍏朵粬绫诲瀷棰勮鎴栫洿鎺ヤ笅杞� --> + <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="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)" /> + :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> @@ -391,10 +541,19 @@ </div> </div> <div class="questionList" v-if="activeMenu == '棰樺簱'" v-loading="listLoading"> - <div class="resourceSearchBox" v-if="exercisesType !== 'collection' && exercisesType !== 'wrong'"> + <div + class="resourceSearchBox" + v-if="exercisesType !== 'collection' && exercisesType !== 'wrong'" + > <div class="inputBox"> - <el-input class="custom-input" placeholder="璇疯緭鍏ュ唴瀹�" v-model="searchText" @keyup.enter="searchBook" - clearable @clear="handleClear"> + <el-input + class="custom-input" + placeholder="璇疯緭鍏ュ唴瀹�" + v-model="searchText" + @keyup.enter="searchBook" + clearable + @clear="handleClear" + > <template #prefix> <img :src="listSearch" @click="searchBook" class="hover" /> </template> @@ -404,16 +563,22 @@ <div class="list-box" v-loading="listLoading"> <div v-if="questionList.length > 0"> <div v-for="(item, index) in questionList" :key="index" class="reMarkItem"> - <div class="questionCon hover" @click="clickQuestion(exercisesType, item)" :title="item.resourceName"> + <div + class="questionCon hover" + @click="clickQuestion(exercisesType, item)" + :title="item.resourceName" + > {{ item.resourceName }} </div> </div> </div> - <div v-if=" - questionList.length == 0 && - exercisesType !== 'collection' && - exercisesType !== 'wrong' - "> + <div + v-if=" + questionList.length == 0 && + exercisesType !== 'collection' && + exercisesType !== 'wrong' + " + > <el-empty :image-size="60" description="鏆傛棤鏁版嵁" /> </div> </div> @@ -425,9 +590,19 @@ </ul> <!-- 鑿滃崟鍐呭鏀惰捣 --> <div class="menuStateBox" v-if="menuState.open"> - <svg @click="menuState.open = false" xmlns="http://www.w3.org/2000/svg" width="20" height="20" - viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" - stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-left"> + <svg + @click="menuState.open = false" + xmlns="http://www.w3.org/2000/svg" + width="20" + height="20" + viewBox="0 0 20 20" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-left" + > <path stroke="none" d="M0 0h24v24H0z" fill="none" /> <path d="M10 12l10 0" /> <path d="M10 12l4 4" /> @@ -474,6 +649,18 @@ <div class="canvas-box" v-show="canvasShow"> <canvas id="canvasRef" :width="canvasWith" :height="canvasheight"></canvas> </div> + <!-- 鐣寗闂归挓缁勪欢 --> + <div + class="watch-box" + v-if="pomodoroRef && pomodoroRef.isShow" + :style="{ top:position.x + 'px', left:position.y + 'px'}" + > + <p @mousedown.native="mouseDown">{{ formatTime(pomodoroRef.pageData.currentTime) }}</p> + <span @click="()=> pomodoroRef.isRuning ? pomodoroRef.pauseFun() : pomodoroRef.startFun()">{{pomodoroRef.isRuning ? '鏆傚仠': '寮�濮�'}}</span> + <span @click="pomodoroRef.resetFun" >閲嶇疆</span> + <span @click="pomodoroRef.handleRestFun(false)">闀夸紤鎭�</span> + <span @click="pomodoroRef.handleRestFun(true)">鐭紤鎭�</span> + </div> </div> </div> <!-- 鐢荤瑪缁勪欢 --> @@ -483,28 +670,42 @@ <div class="popinnerBox"> <div class="brush"> <div class="thickness"> - <div :class="toolSelectData.thicknessActive == '1' ? 'small active' : 'small'" - @click="selectThickness('1')"></div> - <div :class="toolSelectData.thicknessActive == '3' ? 'middle active' : 'middle'" - @click="selectThickness('3')"></div> - <div :class="toolSelectData.thicknessActive == '5' ? 'large active' : 'large'" - @click="selectThickness('5')"></div> + <div + :class="toolSelectData.thicknessActive == '1' ? 'small active' : 'small'" + @click="selectThickness('1')" + ></div> + <div + :class="toolSelectData.thicknessActive == '3' ? 'middle active' : 'middle'" + @click="selectThickness('3')" + ></div> + <div + :class="toolSelectData.thicknessActive == '5' ? 'large active' : 'large'" + @click="selectThickness('5')" + ></div> </div> <div class="lineStyle"> <div class="lineTypeBox"> - <div :class="toolSelectData.lineTypeActive == 'solid' - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="selectLineType('solid')"> + <div + :class=" + toolSelectData.lineTypeActive == 'solid' + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="selectLineType('solid')" + > <div class="solid"></div> <div class="activeIcon" v-if="toolSelectData.lineTypeActive == 'solid'"> <img :src="xuanzhong" /> </div> </div> - <div :class="toolSelectData.lineTypeActive == 'dashed' - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="selectLineType('dashed')"> + <div + :class=" + toolSelectData.lineTypeActive == 'dashed' + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="selectLineType('dashed')" + > <div class="dashed"></div> <div class="activeIcon" v-if="toolSelectData.lineTypeActive == 'dashed'"> <img :src="xuanzhong" /> @@ -512,8 +713,12 @@ </div> </div> <div class="colorSelectBox"> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" - @click="lineColorSelect(item)"> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="lineColorSelect(item)" + > <div :style="{ background: item.key }" class="scribeItem"> <img :src="xuanzhong" v-if="item.key == toolSelectData.lineColorActive" /> </div> @@ -535,28 +740,40 @@ <div class="popinnerBox"> <div class="lineStyle"> <div class="lineTypeBox"> - <div :class="toolSelectData.fontSizeActive == '14' - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="selectfontSize('14')"> + <div + :class=" + toolSelectData.fontSizeActive == '14' + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="selectfontSize('14')" + > 灏� <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '14'"> <img :src="xuanzhong" /> </div> </div> - <div :class="toolSelectData.fontSizeActive == '16' - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="selectfontSize('16')"> + <div + :class=" + toolSelectData.fontSizeActive == '16' + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="selectfontSize('16')" + > 涓� <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '16'"> <img :src="xuanzhong" /> </div> </div> - <div :class="toolSelectData.fontSizeActive == '18' - ? 'typeItem lineTypeActive' - : 'typeItem' - " @click="selectfontSize('18')"> + <div + :class=" + toolSelectData.fontSizeActive == '18' + ? 'typeItem lineTypeActive' + : 'typeItem' + " + @click="selectfontSize('18')" + > 澶� <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '18'"> <img :src="xuanzhong" /> @@ -565,8 +782,12 @@ </div> <div class="lineStyle"> <div class="colorSelectBox"> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" - @click="lineColorSelect(item)"> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="lineColorSelect(item)" + > <div :style="{ background: item.key }" class="scribeItem"> <img :src="xuanzhong" v-if="item.key == toolSelectData.lineColorActive" /> </div> @@ -588,22 +809,34 @@ <div class="graphBox"> <div class="graphSelect"> <div class="flex1"> - <div class="square hover" @click="graphSelect('square')"></div> + <div :class="toolSelectData.graphType == 'square' ? 'acitveGraphType' : ''"> + <div class="square hover" @click="graphSelect('square')"></div> + </div> </div> <div class="flex1"> - <div class="rotundity hover" @click="graphSelect('rotundity')"></div> + <div :class="toolSelectData.graphType == 'rotundity' ? 'acitveGraphType' : ''"> + <div class="rotundity hover" @click="graphSelect('rotundity')"></div> + </div> </div> <div class="flex1"> - <div class="triangle hover" @click="graphSelect('triangle')"></div> + <div :class="toolSelectData.graphType == 'triangle' ? 'acitveGraphType' : ''"> + <div class="triangle hover" @click="graphSelect('triangle')"></div> + </div> </div> <div class="flex1"> - <div class="lineSegment hover" @click="graphSelect('lineSegment')">/</div> + <div :class="toolSelectData.graphType == 'lineSegment' ? 'acitveGraphType' : ''"> + <div class="lineSegment hover" @click="graphSelect('lineSegment')">/</div> + </div> </div> </div> <div class="lineStyle"> <div class="colorSelectBox"> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" - @click="lineColorSelect(item)"> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="lineColorSelect(item)" + > <div :style="{ background: item.key }" class="scribeItem"> <img :src="xuanzhong" v-if="item.key == toolSelectData.lineColorActive" /> </div> @@ -664,29 +897,57 @@ <div class="menuList"> <ul class="menu" v-if="teachToolsMenuData.length > 0"> <li v-for="item in teachToolsMenuData" :key="item.key" class="hover"> - <div :style="!toolState.open ? 'padding:10px 15px' : ''" v-if="item.isShow" - @click="selectTeachTools(item)"> + <div + :style="!toolState.open ? 'padding:10px 15px' : ''" + v-if="item.isShow" + @click="selectTeachTools(item)" + > <img :src="item.icon" alt="" /> <span v-if="toolState.open">{{ item.name }}</span> </div> </li> </ul> </div> - <div :class="['openBox', toolState.open ? 'right' : '']" v-if="teachToolsMenuData.length > 0"> + <div + :class="['openBox', toolState.open ? 'right' : '']" + v-if="teachToolsMenuData.length > 0" + > <!-- <img :src="shouqiR" v-if="toolState.open" @click="toolState.open = false" /> --> <!-- <img :src="shouqiL" v-if="!toolState.open" @click="toolState.open = true" /> --> - <svg v-if="!toolState.open" @click="toolState.open = true" xmlns="http://www.w3.org/2000/svg" width="24" - height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" - stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-left"> + <svg + v-if="!toolState.open" + @click="toolState.open = true" + xmlns="http://www.w3.org/2000/svg" + width="24" + height="24" + viewBox="0 0 24 24" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-left" + > <path stroke="none" d="M0 0h24v24H0z" fill="none" /> <path d="M10 12l10 0" /> <path d="M10 12l4 4" /> <path d="M10 12l4 -4" /> <path d="M4 4l0 16" /> </svg> - <svg v-if="toolState.open" @click="toolState.open = false" xmlns="http://www.w3.org/2000/svg" width="24" - height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" - stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-right"> + <svg + v-if="toolState.open" + @click="toolState.open = false" + xmlns="http://www.w3.org/2000/svg" + width="24" + height="24" + viewBox="0 0 24 24" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-bar-to-right" + > <path stroke="none" d="M0 0h24v24H0z" fill="none" /> <path d="M14 12l-10 0" /> <path d="M14 12l-4 4" /> @@ -699,13 +960,17 @@ <el-tab-pane label="澶囪缁勪欢" name="first"> <div class="tabBox"> <div class="insertSelect"> - <div :class="selectType == 'resource' ? 'typeActive' : 'selectItem hover'" - @click="selectTypeClick('resource')"> + <div + :class="selectType == 'resource' ? 'typeActive' : 'selectItem hover'" + @click="selectTypeClick('resource')" + > <img :src="selectType == 'resource' ? charuziyuan_blue : charuziyuan" /> <div>鎻掑叆璧勬簮</div> </div> - <div :class="selectType == 'answer' ? 'typeActive' : 'selectItem hover'" - @click="selectTypeClick('answer')"> + <div + :class="selectType == 'answer' ? 'typeActive' : 'selectItem hover'" + @click="selectTypeClick('answer')" + > <img :src="selectType == 'answer' ? dati_charu_blue : dati_charu" /> <div>鎻掑叆绛旈</div> </div> @@ -724,11 +989,20 @@ </div> </div> <!-- 鐢荤瑪宸ュ叿鏍� --> - <div draggable="true" class="draggableBox" :style="`left:${floatingToolData.elLeft}px`" - v-if="floatingToolBox.length > 0"> + <div + draggable="true" + class="draggableBox" + :style="`left:${floatingToolData.elLeft}px`" + v-if="floatingToolBox.length > 0" + > <div v-for="item in floatingToolBox" :key="item.name" @click="floatItemHandle(item)"> <div v-if="item.isShow"> - <el-popover placement="right" width="120" trigger="click" v-if="floatingToolData.activeToolData == '鏍囪'"> + <el-popover + placement="right" + width="120" + trigger="click" + v-if="floatingToolData.activeToolData == '鏍囪'" + > <div class="popinnerBox"> <div class="label" v-if="floatingToolData.activeToolData == '鏍囪'"> <div class="labelItem hover" @click="labelShow('hide')"> @@ -742,10 +1016,13 @@ </div> </div> <template #reference> - <div :class="floatingToolData.activeToolData == item.name - ? 'floatToolActive floatToolItem' - : 'floatToolItem' - "> + <div + :class=" + floatingToolData.activeToolData == item.name + ? 'floatToolActive floatToolItem' + : 'floatToolItem' + " + > <el-tooltip class="box-item" effect="dark" :content="item.name" placement="right"> <div class="imgBox"> <img :src="item.icon" alt="" /> @@ -763,13 +1040,17 @@ </div> </el-tooltip> </div> - <div :class="floatingToolData.activeToolData == item.name - ? 'floatToolActive floatToolItem' - : 'floatToolItem' - " v-else-if=" + <div + :class=" + floatingToolData.activeToolData == item.name + ? 'floatToolActive floatToolItem' + : 'floatToolItem' + " + v-else-if=" floatingToolData.activeToolData != '涔︾' && floatingToolData.activeToolData != '鏍囪' - "> + " + > <el-tooltip class="box-item" effect="dark" :content="item.name" placement="right"> <div class="imgBox"> <img :src="item.icon" alt="" /> @@ -782,10 +1063,19 @@ </div> <!-- 閫変腑宸ュ叿鏍� --> - <div class="dialogToolBox" id="dialogToolBox" v-show="showToolBox" - :style="{ top: `${dialogToolData.top}px`, left: `${dialogToolData.left}px` }"> + <div + class="dialogToolBox" + id="dialogToolBox" + v-show="showToolBox" + :style="{ top: `${dialogToolData.top}px`, left: `${dialogToolData.left}px` }" + > <div class="colorSelectBox" v-show="toolActive == '楂樹寒' || toolActive == '鍒掔嚎'"> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" @click="clickSelect(item)"> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="clickSelect(item)" + > <div :style="{ background: item.key }" class="scribeItem"> <img :src="xuanzhong1" v-if="item.key == colorActive" /> </div> @@ -793,7 +1083,10 @@ </div> <div class="toolSelectBox" v-show="toolActive != '楂樹寒' && toolActive != '鍒掔嚎'"> <div v-for="item in dialogToolList" :key="item.icon" @click="dialogToolHandle(item)"> - <div :class="item.name == toolActive ? 'dialogToolItem active' : 'dialogToolItem'" v-if="item.isShow"> + <div + :class="item.name == toolActive ? 'dialogToolItem active' : 'dialogToolItem'" + v-if="item.isShow" + > <el-tooltip class="box-item" effect="dark" :content="item.name" placement="bottom"> <img :src="item.icon" alt="" /> </el-tooltip> @@ -805,8 +1098,11 @@ </div> </div> <!-- 鍒掔嚎锛岄珮浜垹闄� --> - <div class="lineDeleteBox" v-show="lineDelete.showLineDelete" - :style="{ top: `${lineDelete.top}px`, left: `${lineDelete.left}px` }"> + <div + class="lineDeleteBox" + v-show="lineDelete.showLineDelete" + :style="{ top: `${lineDelete.top}px`, left: `${lineDelete.left}px` }" + > <!-- <el-button @click="delUserKey">鍒犻櫎</el-button> --> <div class="dialogToolItem"> <el-tooltip class="box-item" effect="dark" content="鍒犻櫎" placement="bottom"> @@ -820,26 +1116,41 @@ </div> </div> <!-- 绗旇鎮诞妗� --> - <div class="noteContentBox" v-show="noteContent.show" :style="{ - top: `${noteContent.top}px`, - left: `${noteContent.left}px`, - background: noteContent.color - }"> + <div + class="noteContentBox" + v-show="noteContent.show" + :style="{ + top: `${noteContent.top}px`, + left: `${noteContent.left}px`, + background: noteContent.color + }" + > <div>{{ noteContent.note }}</div> </div> <!-- 鑻辨枃涔﹂�変腑鍗曡瘝璇嶅吀鍐呭 --> - <div class="dictionaryDataBox" v-if="dictionaryData.showContent" - :style="{ top: `${dialogToolData.top}px`, left: `${dialogToolData.left}px` }"> + <div + class="dictionaryDataBox" + v-if="dictionaryData.showContent" + :style="{ top: `${dialogToolData.top}px`, left: `${dialogToolData.left}px` }" + > <div class="content"> <div class="word">{{ dictionaryData.data.word }}</div> <div class="phone_con"> <div class="per-phone"> - 鑻� <span>/{{ dictionaryData.data.ukPhone }}/</span><img :src="sound" class="soundBtn hover" - @click="soundWord(dictionaryData.data.word, 'en-UK')" /> + 鑻� <span>/{{ dictionaryData.data.ukPhone }}/</span + ><img + :src="sound" + class="soundBtn hover" + @click="soundWord(dictionaryData.data.word, 'en-UK')" + /> </div> <div class="per-phone"> - 缇� <span>/{{ dictionaryData.data.usPhone }}/</span><img :src="sound" class="soundBtn hover" - @click="soundWord(dictionaryData.data.word, 'en-US')" /> + 缇� <span>/{{ dictionaryData.data.usPhone }}/</span + ><img + :src="sound" + class="soundBtn hover" + @click="soundWord(dictionaryData.data.word, 'en-US')" + /> </div> </div> <div class="trans"> @@ -853,29 +1164,64 @@ </div> </div> - <el-dialog title="璧勬簮" align-center v-model="resourVisble" width="845" class="resourDialog" - :before-close="resourVisbleClose"> + <!-- 鐧芥澘 --> + <div v-if="whiteBoard" class="whiteBoardBox"> + <whiteBoardBox @whiteBoardClose="whiteBoardClose"></whiteBoardBox> + </div> + + <el-dialog + title="璧勬簮" + align-center + v-model="resourVisble" + width="845" + class="resourDialog" + :before-close="resourVisbleClose" + > <div class="videoBox" v-if="resourType == '瑙嗛'"> <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> --> <audio ref="audioPlayer" :src="testAudio" controls @loadedmetadata="autoPlay"></audio> </div> <!-- 鍥剧墖 --> - <el-image-viewer v-if="confirmDialog" :zoom-rate="1.2" @close="closePreview" :initial-index="previewIndex" - :url-list="imgPreviewList" /> - <el-dialog title="娣诲姞绗旇" align-center v-model="addNoteVisble" :before-close="handleClose" class="myNoteDialogs"> + <el-image-viewer + v-if="confirmDialog" + :zoom-rate="1.2" + @close="closePreview" + :initial-index="previewIndex" + :url-list="imgPreviewList" + /> + <el-dialog + title="娣诲姞绗旇" + align-center + v-model="addNoteVisble" + :before-close="handleClose" + class="myNoteDialogs" + > <div class="formBox"> - <el-input type="textarea" :rows="4" v-model="formData.desc" placeholder="璇疯緭鍏ョ瑪璁板唴瀹�"></el-input> + <el-input + type="textarea" + :rows="4" + v-model="formData.desc" + placeholder="璇疯緭鍏ョ瑪璁板唴瀹�" + ></el-input> </div> <div class="noteColorSelectBox"> - <div v-for="item in colorSelectList" :key="item.key" class="flex1 hover" @click="clickSelectColor(item)"> + <div + v-for="item in colorSelectList" + :key="item.key" + class="flex1 hover" + @click="clickSelectColor(item)" + > <div :style="{ background: item.key }" class="scribeItem"> <img :src="xuanzhong" v-if="item.key == noteColorActive" /> </div> @@ -889,15 +1235,23 @@ </span> </template> </el-dialog> - <el-dialog title="淇濆瓨鎴浘" align-center v-model="screenshotVisble" :before-close="screenshotClose" width="400" - class="resourDialog screenshotDialog"> + <el-dialog + title="淇濆瓨鎴浘" + align-center + v-model="screenshotVisble" + :before-close="screenshotClose" + width="400" + class="resourDialog screenshotDialog" + > <div class="formBox"> <el-input v-model="nameData" placeholder="璇疯緭鍏ユ埅鍥惧悕绉�"></el-input> </div> <template #footer> <span class="dialog-footer"> <el-button @click="screenshotClose">鍙� 娑�</el-button> - <el-button type="primary" @click="addScreenshot" :loading="screenshotLoading">纭� 瀹�</el-button> + <el-button type="primary" @click="addScreenshot" :loading="screenshotLoading" + >纭� 瀹�</el-button + > </span> </template> </el-dialog> @@ -906,7 +1260,13 @@ <iframe :src="'https://baike.baidu.com/item/' + dialogToolData.txt" frameborder="0"></iframe> </div> </el-dialog> - <el-dialog title="AI鏅鸿兘闂瓟" align-center v-model="wendaVisible" width="60%" class="myAnserDialogs"> + <el-dialog + title="AI鏅鸿兘闂瓟" + align-center + v-model="wendaVisible" + width="60%" + class="myAnserDialogs" + > <div class="wendabox"> <iframe src="https://yiyan.baidu.com/" frameborder="0"></iframe> </div> @@ -917,7 +1277,13 @@ <dictionary /> </div> </el-dialog> - <el-dialog title="GGB鍑芥暟宸ュ叿" align-center v-model="functionVisible" width="80%" class="myDialogs"> + <el-dialog + title="GGB鍑芥暟宸ュ叿" + align-center + v-model="functionVisible" + width="80%" + class="myDialogs" + > <div class="wendabox"> <iframe src="https://www.geogebra.org/calculator" frameborder="0"></iframe> </div> @@ -929,6 +1295,11 @@ </el-dialog> <el-dialog title="妯″瀷宸ュ叿" align-center v-model="modelToolVisble" width="80%" class="myDialogs"> <div class="wendabox"> + <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> @@ -937,19 +1308,48 @@ <newWord :resourceUrl="resourceUrl" /> </div> </el-dialog> - <el-dialog title="閿欓鏈�" align-center v-model="wrongQuestionVisble" width="800" class="myDialogs"> + <el-dialog + title="閿欓鏈�" + align-center + v-model="wrongQuestionVisble" + width="800" + class="myDialogs" + > <div class="wendabox"> <wrongQuestion /> </div> </el-dialog> - <!-- 绛旈鍣� --> - <examination ref="examinationRef" :activeBook="bookConfig" :info="examinationData.info" :type="examinationData.type" - :infoType="examinationData.infoType" /> - <!-- 璁$畻鍣� --> - <el-dialog title="璁$畻鍣�" align-center v-model="calculatorVisble" width="850" class="myDialogs"> - <calculatorNew></calculatorNew> + <el-dialog title="鍏紡缂栬緫" align-center v-model="formulaDialog" class="myDialogs"> + <div class="wendabox"> + <formula /> + </div> </el-dialog> + <!-- 绛旈鍣� --> + <examination + ref="examinationRef" + :activeBook="bookConfig" + :info="examinationData.info" + :type="examinationData.type" + :infoType="examinationData.infoType" + /> + <!-- 璁$畻鍣� --> + <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> + <!-- 鐣寗闂归挓 --> + <!-- <pomodoro ref="pomodoroRef" /> --> </template> +<script setup lang="ts"> +import examination from '@/views/examination/index.vue' +import pomodoro from '@/views/components/pomodoro.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 { useFormatData } from '@/hooks/public' +import useClipboard from 'vue-clipboard3' +const { toClipboard } = useClipboard() +const { formatTime } = useFormatData() const MG: any = inject('MG') const toolClass = inject('toolClass') //鑾峰彇璺敱鍣� @@ -959,9 +1359,10 @@ 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 whiteBoardBox from '@/views/components/whiteBoard.vue' import logo from '@/assets/images/header/logo.png' import mulu from '@/assets/images/menu/mulu.png' import biji from '@/assets/images/menu/biji.png' @@ -1060,7 +1461,7 @@ import { microApps } from '@/child.ts' import { open } from 'fs' let token = localStorage.getItem('token') -const canvasWith = ref(1000) +const canvasWith = ref(800) const canvasheight = ref(3000) const screenWidth = ref( window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth @@ -1073,6 +1474,7 @@ const bookInfo = ref() const isBuy = ref(false) const tryPageCount = ref(0) +const searchText = ref() onMounted(() => { if (token) { getUserInfo() @@ -1257,8 +1659,9 @@ } MG.store.getProductList(obj).then((res) => { console.log(res.datas, '鍥句功淇℃伅') + if (!res.datas.length) return bookInfo.value = res.datas[0] - if (res.datas[0].purchasedSaleMethodIdList.includes(res.datas[0].defaultSaleMethodId)) { + if (res.datas[0].purchasedSaleMethodIdList.indexOf(res.datas[0].defaultSaleMethodId) > -1) { isBuy.value = true } else { isBuy.value = false @@ -1337,11 +1740,7 @@ name: '鐭ヨ瘑鍥捐氨', icon: zhishitupu, isShow: bookConfig.value.textbookComponents.indexOf('6BE6A3DC') > -1 - }, - { - name: '鎴浘', - icon: jietu, - isShow: bookConfig.value.textbookComponents.indexOf('CB0EACEC') > -1 + // isShow: true }, { name: '涔︾', @@ -1356,6 +1755,11 @@ bookConfig.value.textbookComponents.indexOf('AFC1A288') > -1 || bookConfig.value.textbookComponents.indexOf('A434F2C0') > -1 || bookConfig.value.textbookComponents.indexOf('A4821F71') > -1 + }, + { + name: '鎴浘', + icon: jietu, + isShow: bookConfig.value.textbookComponents.indexOf('CB0EACEC') > -1 } ] teachToolsMenuData = [ @@ -1429,18 +1833,24 @@ icon: fanqiezhong, isShow: bookConfig.value.textbookComponents.indexOf('E4DC9777') > -1 } + // { + // name: '鐣寗闂归挓', + // icon: fanqiezhong, + // isShow: true + // } ] floatingToolBox = [ { icon: huabi, name: '鐢荤瑪', - // isShow: bookConfig.value.textbookComponents.indexOf('800109C0') > -1 - isShow:true + isShow: bookConfig.value.textbookComponents.indexOf('800109C0') > -1 + // isShow: true }, { icon: baiban, name: '鐧芥澘', isShow: bookConfig.value.textbookComponents.indexOf('029DB3E0') > -1 + // isShow: true }, { icon: biaozhu, @@ -1517,10 +1927,19 @@ 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 = { @@ -1535,7 +1954,6 @@ } const handleNodeClick = (data) => { - console.log(data) if (!isBuy.value) { if (data.start < tryPageCount.value) { headerData.process = data.start @@ -1675,6 +2093,15 @@ 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 { @@ -1749,6 +2176,15 @@ 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) + } + } }) } } @@ -1777,11 +2213,14 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } //璧勬簮鎾斁瑙嗛 +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) { @@ -1798,6 +2237,59 @@ testAudio.value = bookConfig.value.resourceUrl + '/' + data.resourcePath } autoPlay() + } 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) @@ -1809,6 +2301,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 = () => { @@ -1836,6 +2335,9 @@ //璧勬簮绫诲瀷閫夋嫨榛樿/鏁欏笀 const selectResourceType = (type) => { resourceType.value = type + resourceDataList.value = [] + classifySelectList.value = [] + activeClassify.value = '' searchText.value = '' if (type == 'collect') { getCollectResource() @@ -1853,10 +2355,6 @@ } else { getResourceData() } -<<<<<<< HEAD -======= - ->>>>>>> bcee5cd49c38973e2c6c316e1405f27ab1b74db7 } const searchBtn = () => { if (searchShow.value) { @@ -1951,6 +2449,15 @@ 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) + } + } }) } } @@ -1974,18 +2481,13 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } // 鏀惰棌鎸夐挳 const handleCollectResource = (id, md5, resourcePath, resourceType, source, resourceName) => { -<<<<<<< HEAD if (collectResourceList.value.findIndex((item) => item.id == id) > -1) { collectResourceList.value = collectResourceList.value.filter((item) => item.id != id) -======= - if (collectResourceList.value.findIndex(item => item.id == id) > -1) { - collectResourceList.value = collectResourceList.value.filter(item => item.id != id) ->>>>>>> bcee5cd49c38973e2c6c316e1405f27ab1b74db7 } else { collectResourceList.value.push({ id, @@ -1999,14 +2501,11 @@ MG.identity.setUserKey({ setKeyRequests: [ { -<<<<<<< HEAD domain: 'collectResource', key: bookConfig.value.bookId, value: JSON.stringify(collectResourceList.value) } ] - }, - ], }) } @@ -2064,7 +2563,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } @@ -2096,7 +2595,7 @@ .then(() => { router.push('/login') }) - .catch(() => { }) + .catch(() => {}) } } @@ -2145,6 +2644,7 @@ const menuItemClick = (name) => { searchText.value = '' allSearchReault.value = [] + listLoading.value = false if (menuState.open && activeMenu.value == name) { menuState.open = false } else { @@ -2191,7 +2691,6 @@ // } } -const searchText = ref<string>('') //绛涢�� const menuState = reactive({ open: true, notesColor: 'all' //绗旇棰滆壊 @@ -2326,12 +2825,11 @@ getExercisesList() break case '妫�绱�': - listLoading.value = true allSearchReault.value = [] - console.log(window.qiankunState.searchBookByKeyword) if (window.qiankunState && window.qiankunState.searchBookByKeyword) { let searchReault = window.qiankunState.searchBookByKeyword(searchText.value) if (searchReault.length > 0) { + listLoading.value = true let catalogueList = sortArr(catalogueData.value, 'chapter') if (catalogueList.length > 0) { catalogueList.forEach((item) => { @@ -2360,7 +2858,8 @@ } }) } - console.log(allSearchReault.value, 444) + listLoading.value = false + }else{ listLoading.value = false } } @@ -2445,22 +2944,24 @@ break } } - +type pomodoroType = InstanceType<typeof Pomodoro> const baiduVisible = ref(false) const wendaVisible = ref(false) const cidianVisible = ref(false) 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 pomodoroRef = ref<pomodoroType>() const activeTool = ref(0) const toolState = reactive({ open: true }) const resourceUrl = ref('') -const selectTeachTools = (item) => { +const selectTeachTools = (item: any) => { if (token) { activeTool.value = item.name switch (item.name) { @@ -2474,7 +2975,7 @@ siweiVisble.value = true break case '妯″瀷宸ュ叿': - modelToolVisble.value = true + modelTool.value = true break case '璇嶅吀': cidianVisible.value = true @@ -2485,6 +2986,8 @@ break case '璁$畻鍣�': calculatorVisble.value = true + case '鐣寗闂归挓': + pomodoroRef.value.setDialogVisable(true) break } } else { @@ -2503,7 +3006,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } @@ -2533,7 +3036,7 @@ //鐢诲竷鎮诞鎿嶄綔 -let canvas = null +let canvasBox: any = null const floatingToolData = reactive({ activeToolData: '', //閫変腑宸ュ叿 activeBookmark: '', //閫変腑涔︾ @@ -2544,6 +3047,10 @@ //鐢诲竷 const canvasShow = ref(false) +let textBox: any = null +let activeElBox: any = null +//鐧芥澘 +const whiteBoard = ref(false) //鎴浘浜嬩欢 const nameRef = ref() @@ -2563,7 +3070,6 @@ //娴獥宸ュ叿鏍忕偣鍑讳簨浠� const floatItemHandle = (item) => { - console.log(floatingToolData.activeToolData, 'floatingToolData.activeToolData') if (floatingToolData.activeToolData == '鐢荤瑪') { floatingToolData.activeToolData = '' } else { @@ -2571,10 +3077,17 @@ } canvasShow.value = false + whiteBoard.value = false switch (floatingToolData.activeToolData) { case '鐢荤瑪': canvasShow.value = true toolSelectData.activeTool = 'huabi' + canvasBox = new fabric.Canvas('canvasRef') + canvasBox.setZoom(1); // 璁剧疆鐢诲竷缂╂斁姣斾緥涓�1 + canvasBox.absolutePan({ x: 0, y: 0 }); + break + case '鐧芥澘': + whiteBoard.value = true break case '鏍囪': break @@ -2602,18 +3115,53 @@ const toolSelectHandle = (title) => { toolSelectData.activeTool = title toolSelectData.lineColorActive = '' + canvasBox.isDrawingMode = false switch (title) { case 'huabi': - init() + canvasBox.skipTargetFind = false + canvasBox.isDrawingMode = true + toolSelectData.graphType = '' + canvasBox.freeDrawingBrush.color = '#333' + canvasBox.freeDrawingBrush.width = '3' + canvasBox.on('mouse:down', '') // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:up', '') + canvasBox.on('mouse:move', '') break case 'wenzi': + canvasBox.skipTargetFind = false + canvasBox.isDrawingMode = false + toolSelectData.graphType = '' + textBox = new fabric.IText('璇疯緭鍏ユ枃鏈�', { + left: 50, + top: 50, + fontSize: toolSelectData.fontSizeActive + }) + canvasBox.add(textBox) + canvasBox.on('mouse:down', '') // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:up', '') + canvasBox.on('mouse:move', '') + break + case 'tuxing': + canvasBox.isDrawingMode = false + canvasBox.selectionColor = 'transparent' + canvasBox.skipTargetFind = true + toolSelectData.lineColorActive = '#000' + break + case 'chexiao': + canvasBox.skipTargetFind = false + canvasBox.isDrawingMode = false + canvasBox.remove(activeElBox) + canvasBox.requestRenderAll() + activeElBox = null break case 'tuichu': + canvasBox.skipTargetFind = false + canvasBox.isDrawingMode = false canvasShow.value = false floatingToolData.activeToolData = '' break case 'qingchu': - canvas.clear() + canvasBox.clear() break } } @@ -2621,31 +3169,32 @@ //閫変腑鐢荤瑪绮楃粏 const selectThickness = (str) => { toolSelectData.thicknessActive = str - canvas.freeDrawingBrush.color = toolSelectData.thicknessActive + canvasBox.freeDrawingBrush.width = toolSelectData.thicknessActive } const selectLineType = (str) => { toolSelectData.lineTypeActive = str - init() + if (toolSelectData.lineTypeActive == 'dashed') { + canvasBox.freeDrawingBrush.strokeDashArray = [10] + } else { + canvasBox.freeDrawingBrush.strokeDashArray = null + } } //鐢荤瑪棰滆壊閫夋嫨 const lineColorSelect = (item) => { toolSelectData.lineColorActive = item.key - canvas.freeDrawingBrush.color = item.key -} -//鐢诲竷灞炴�� -const isDrawing = ref(true) // 鏄惁寮�鍚粯鍥撅紝true 寮�鍚紱false 鍏抽棴 -const init = () => { - canvas = new fabric.Canvas('canvasRef', { - isDrawingMode: isDrawing.value // 鍚敤缁樼敾妯″紡 - }) - canvas.freeDrawingBrush.color = toolSelectData.lineColorActive - canvas.freeDrawingBrush.width = toolSelectData.thicknessActive + if ((toolSelectData.activeTool == 'huabi')) { + canvasBox.freeDrawingBrush.color = item.key + } + if ((toolSelectData.activeTool == 'wenzi')) { + textBox.fill = toolSelectData.lineColorActive + } } //鏂囧瓧澶у皬 const selectfontSize = (str) => { toolSelectData.fontSizeActive = str + textBox.fontSize = toolSelectData.fontSizeActive } //閫夋嫨鍥惧舰 @@ -2653,14 +3202,190 @@ toolSelectData.graphType = type switch (type) { case 'square': + canvasBox.on('mouse:down', canvasMouseDown) // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:up', canvasMouseUp) + canvasBox.selectionBorderColor = toolSelectData.lineColorActive break case 'rotundity': + canvasBox.on('mouse:down', canvasMouseDown) // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:up', canvasMouseUp) + canvasBox.on('mouse:move', canvasMouseMove) break case 'triangle': + canvasBox.on('mouse:down', canvasMouseDown) // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:up', canvasMouseUp) + canvasBox.on('mouse:move', canvasMouseMove) break case 'lineSegment': + canvasBox.on('mouse:down', canvasMouseDown) // 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 + canvasBox.on('mouse:move', canvasMouseMove) // 榧犳爣鍦ㄧ敾甯冧笂绉诲姩 + canvasBox.on('mouse:up', canvasMouseUp) break } +} + +let downPoint = null // 榧犳爣鎸変笅鐨勫潗鏍� +let upPoint = null +let currentCircle = null // 涓存椂鍦嗭紝鍒涘缓鍦嗙殑鏃跺�欎娇鐢� +let currentTriangle = null // 涓存椂涓夎褰� +let currentLine = null // 涓存椂绾挎 +function canvasOnMouseDownDel(opt) { + // 鍙抽敭锛屼笖鍦ㄥ厓绱犱笂鍙抽敭 + // button: 1-宸﹂敭锛�2-涓敭锛�3-鍙抽敭 + // 鍦ㄧ敾甯冧笂鍙抽敭锛宼arget 涓� null + if (opt.button === 1 && opt.target) { + // 鑾峰彇褰撳墠鍏冪礌 + activeElBox = opt.target + } +} +// 榧犳爣鍦ㄧ敾甯冧笂鎸変笅 +function canvasMouseDown(e) { + downPoint = e.absolutePointer + if (toolSelectData.graphType === 'rotundity') { + currentCircle = new fabric.Circle({ + top: downPoint.y, + left: downPoint.x, + radius: 0, + fill: 'transparent', + stroke: toolSelectData.lineColorActive + }) + + canvasBox.add(currentCircle) + } + if (toolSelectData.graphType === 'triangle') { + currentTriangle = new fabric.Triangle({ + top: downPoint.y, + left: downPoint.x, + width: 0, + height: 0, + fill: 'transparent', + stroke: toolSelectData.lineColorActive + }) + canvasBox.add(currentTriangle) + } + if (toolSelectData.graphType === 'lineSegment') { + currentLine = new fabric.Line( + [ + downPoint.x, + downPoint.y, // 璧峰鐐瑰潗鏍� + downPoint.x, + downPoint.y // 缁撴潫鐐瑰潗鏍� + ], + { + stroke: toolSelectData.lineColorActive // 绗旇Е棰滆壊 + } + ) + canvasBox.add(currentLine) + } +} +// 榧犳爣鍦ㄧ敾甯冧笂鏉惧紑 +function canvasMouseUp(e) { + if (toolSelectData.graphType === 'square') { + // 鍒涘缓鐭╁舰 + createRect(e.absolutePointer) + } + + if (toolSelectData.graphType === 'rotundity') { + if (JSON.stringify(downPoint) === JSON.stringify(upPoint)) { + canvasBox.remove(currentCircle) + } else { + if (currentCircle) { + currentCircle.set('stroke', toolSelectData.lineColorActive) + } + } + currentCircle = null + } + + if (toolSelectData.graphType === 'triangle') { + if (JSON.stringify(downPoint) === JSON.stringify(upPoint)) { + canvasBox.remove(currentTriangle) + } else { + currentTriangle.set('stroke', toolSelectData.lineColorActive) + } + currentTriangle = null + } + + if (toolSelectData.graphType === 'lineSegment') { + if (JSON.stringify(downPoint) === JSON.stringify(upPoint)) { + canvasBox.remove(currentLine) + } else { + currentLine.set('stroke', toolSelectData.lineColorActive) + } + currentLine = null + } +} +// 鍒涘缓鐭╁舰 +function createRect(pointer) { + // 鐐瑰嚮浜嬩欢锛屼笉鐢熸垚鐭╁舰 + if (JSON.stringify(downPoint) === JSON.stringify(pointer)) { + return + } + + // 鍒涘缓鐭╁舰 + // 鐭╁舰鍙傛暟璁$畻 + let top = Math.min(downPoint.y, pointer.y) + let left = Math.min(downPoint.x, pointer.x) + let width = Math.abs(downPoint.x - pointer.x) + let height = Math.abs(downPoint.y - pointer.y) + + // 鐭╁舰瀵硅薄 + const rect = new fabric.Rect({ + top, + left, + width, + height, + fill: 'transparent', + stroke: toolSelectData.lineColorActive + }) + // 灏嗙煩褰㈡坊鍔犲埌鐢诲竷涓� + canvasBox.add(rect) + downPoint = null +} +// 榧犳爣鍦ㄧ敾甯冧笂绉诲姩 +function canvasMouseMove(e) { + if (toolSelectData.graphType === 'rotundity' && currentCircle) { + const currentPoint = e.absolutePointer + + let radius = + Math.min(Math.abs(downPoint.x - currentPoint.x), Math.abs(downPoint.y - currentPoint.y)) / 2 + let top = currentPoint.y > downPoint.y ? downPoint.y : downPoint.y - radius * 2 + let left = currentPoint.x > downPoint.x ? downPoint.x : downPoint.x - radius * 2 + + currentCircle.set('radius', radius) + currentCircle.set('top', top) + currentCircle.set('left', left) + + canvasBox.requestRenderAll() + } + if (toolSelectData.graphType === 'triangle' && currentTriangle) { + const currentPoint = e.absolutePointer + + let width = Math.abs(downPoint.x - currentPoint.x) + let height = Math.abs(downPoint.y - currentPoint.y) + + let top = currentPoint.y > downPoint.y ? downPoint.y : currentPoint.y + let left = currentPoint.x > downPoint.x ? downPoint.x : currentPoint.x + + currentTriangle.set('width', width) + currentTriangle.set('height', height) + currentTriangle.set('top', top) + currentTriangle.set('left', left) + canvasBox.requestRenderAll() + } + if (toolSelectData.graphType === 'lineSegment' && currentLine) { + const currentPoint = e.absolutePointer + + currentLine.set('x2', currentPoint.x) + currentLine.set('y2', currentPoint.y) + + canvasBox.requestRenderAll() + } +} + +//鐧芥澘鍏抽棴 +const whiteBoardClose = () => { + whiteBoard.value = false + floatingToolData.activeToolData = '' } //鏍囪鏄剧ず闅愯棌 const labelShow = (str) => { @@ -2730,7 +3455,7 @@ }) getReMarkList() }) - .catch(function (error) { }) + .catch(function (error) {}) } } else { ElMessageBox.confirm('璇峰厛鐧诲綍锛�', { @@ -2748,7 +3473,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } const getReMarkList = () => { @@ -2794,13 +3519,12 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } //璺宠浆 const goReMark = (item) => { - console.log(item) if (window.qiankunState && window.qiankunState.gotoPage) { window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page)) } @@ -2874,7 +3598,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } //纭鍥炶皟 @@ -2885,7 +3609,6 @@ } //鍙栨秷鍥炶皟 const closeFn = (base64: any) => { - console.log(base64) floatingToolData.activeToolData = '' } //淇濆瓨鎴浘 @@ -2985,7 +3708,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } //鏌ョ湅鎴浘 @@ -3033,7 +3756,7 @@ getScreenshotList() }) }) - .catch(() => { }) + .catch(() => {}) } //閫変腑鏂囧瓧宸ュ叿鏍� @@ -3132,7 +3855,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 @@ -3169,10 +3891,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 } @@ -3298,7 +4018,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } @@ -3388,7 +4108,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } @@ -3413,7 +4133,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) => { @@ -3455,7 +4174,6 @@ }) } } - console.log(scribeData.noteList, 'scribeData.noteList') } listLoading.value = false }) @@ -3475,7 +4193,7 @@ }) } }) - .catch(() => { }) + .catch(() => {}) } } @@ -3529,13 +4247,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 } @@ -3585,7 +4301,6 @@ //绗旇璺宠浆 const jumpContent = (item) => { - console.log(item) if (window.qiankunState && window.qiankunState.gotoPage) { window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page)) } @@ -3593,7 +4308,6 @@ //鑿滃崟绗旇缂栬緫 const update = (item) => { - console.log(item) dialogToolData.chapter = item.chapterNum noteColorActive.value = item.color formData.id = item.id @@ -3662,7 +4376,7 @@ } }) }) - .catch(() => { }) + .catch(() => {}) } //鑾峰彇閫変腑鑻辨枃璇嶅吀 @@ -3676,13 +4390,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 } }) @@ -3771,6 +4483,34 @@ router.replace({ path: '/login' }) + } +} + +const formulaDialog = ref(false) +const openFormulaDialog = () => { + formulaDialog.value = true +} + +// 鐣寗閽熺Щ鍔� +const isMove = ref<boolean>(false) +const position = reactive({x:100,y:100}) +const dragOffset = reactive({x:0,y:0}) +const mouseDown = (e: MouseEvent) => { + isMove.value = true + dragOffset.x = e.clientX - position.x + dragOffset.y = e.clientY - position.y + document.addEventListener('mousemove', mouseMove) + document.addEventListener('mouseup', mouseUp) +} +const mouseUp = (e: MouseEvent) => { + isMove.value = false + document.removeEventListener('mousemove', mouseMove) + document.removeEventListener('mouseup', mouseUp) +} +const mouseMove = (e: MouseEvent) => { + if (isMove.value) { + position.x = e.clientX - dragOffset.x + position.y = e.clientY - dragOffset.y } } </script> @@ -4371,11 +5111,7 @@ } .questionList { -<<<<<<< HEAD height: 83%; -======= - height: 83% ->>>>>>> bcee5cd49c38973e2c6c316e1405f27ab1b74db7 } .question-bottom { @@ -4386,10 +5122,6 @@ width: 300px; padding: 20px 0; background-color: #fff; -<<<<<<< HEAD -======= - ->>>>>>> bcee5cd49c38973e2c6c316e1405f27ab1b74db7 li { cursor: pointer; width: 65px; @@ -4531,6 +5263,33 @@ z-index: 96; background: rgba(255, 255, 255, 0.2); } + .watch-box { + display: flex; + align-items: center; + position: absolute; + background-color: #555; + color: #fff; + padding: 10px; + border-radius: 5px; + width: max-content; + p { + cursor: move; + padding: 0 8px; + font-size: 18px; + border-radius: 4px; + margin-right: 10px; + background-color: #666; + } + span { + cursor: pointer; + border-right: 1px solid #fff; + padding: 0 4px; + font-size: 14px; + &:last-child { + border-right: none; + } + } + } } } @@ -4561,9 +5320,9 @@ .menu { padding-top: 20px; - li>div { + li > div { // height: 50px; - padding: 10px 36px; + padding: 10px 36px 10px 25px; font-size: 16px; display: flex; align-items: center; @@ -4937,12 +5696,23 @@ .wendabox { width: 100%; - height: 95vh; + height: 82vh; + padding:20px; iframe { width: 100%; height: 100%; } +} + +.whiteBoardBox { + width: 100%; + height: 100%; + position: fixed; + top: 0; + left: 0; + z-index: 2000; + background-color: rgba(2, 2, 2, 0.3); } .myDialogs, @@ -4970,9 +5740,9 @@ right: 0px !important; } - .el-dialog__body { - padding: 20px !important; - } + // .el-dialog__body { + // padding: 20px !important; + // } .el-dialog__footer { padding: 10px 20px 20px !important; @@ -5038,6 +5808,17 @@ .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 { @@ -5054,4 +5835,8 @@ bottom: 30px; left: 50px; } +.iframe-box { + width: 100%; + height: 800px; +} </style> -- Gitblit v1.9.1