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 | 1408 ++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 1,123 insertions(+), 285 deletions(-)
diff --git a/src/views/readerPages/webHome.vue b/src/views/readerPages/webHome.vue
index 1b677de..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,32 +1308,50 @@
<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 heart from '@/assets/images/examination/collectIcon.png'
-import isHeart from '@/assets/images/examination/collectClickIcon.png'
-import { ref, reactive, watch, onMounted, onBeforeMount, onBeforeUnmount, inject, defineComponent } from 'vue'
+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'
-import examination from '../examination/index.vue'
-import calculator from '../components/calculator.vue'
-import calculatorNew from '../components/calculatorNew.vue'
const { toClipboard } = useClipboard()
+const { formatTime } = useFormatData()
const MG: any = inject('MG')
const toolClass = inject('toolClass')
-const qiankunActions = inject('qiankunActions')
//鑾峰彇璺敱鍣�
let router = useRouter()
//鑾峰彇褰撳墠璺敱鐨勪俊鎭�
@@ -970,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'
@@ -1071,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
@@ -1081,9 +1471,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
@@ -1114,12 +1511,14 @@
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)
+ }
}
})
@@ -1232,6 +1631,45 @@
// }
// )
+//鏍规嵁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, '鍥句功淇℃伅')
+ if (!res.datas.length) return
+ bookInfo.value = res.datas[0]
+ if (res.datas[0].purchasedSaleMethodIdList.indexOf(res.datas[0].defaultSaleMethodId) > -1) {
+ isBuy.value = true
+ } else {
+ isBuy.value = false
+ }
+ tryPageCount.value = Number(res.datas[0].probationPage)
+ })
+}
+
const getUserInfo = () => {
MG.identity.getCurrentAppUser().then((res) => {
console.log(res, '鐢ㄦ埛淇℃伅')
@@ -1302,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: '涔︾',
@@ -1321,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 = [
@@ -1394,17 +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
},
{
icon: baiban,
name: '鐧芥澘',
isShow: bookConfig.value.textbookComponents.indexOf('029DB3E0') > -1
+ // isShow: true
},
{
icon: biaozhu,
@@ -1481,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 = {
@@ -1499,9 +1954,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)
@@ -1639,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 {
@@ -1713,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)
+ }
+ }
})
}
}
@@ -1741,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) {
@@ -1762,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)
@@ -1773,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 = () => {
@@ -1800,6 +2335,9 @@
//璧勬簮绫诲瀷閫夋嫨榛樿/鏁欏笀
const selectResourceType = (type) => {
resourceType.value = type
+ resourceDataList.value = []
+ classifySelectList.value = []
+ activeClassify.value = ''
searchText.value = ''
if (type == 'collect') {
getCollectResource()
@@ -1817,7 +2355,6 @@
} else {
getResourceData()
}
-
}
const searchBtn = () => {
if (searchShow.value) {
@@ -1912,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)
+ }
+ }
})
}
}
@@ -1935,13 +2481,13 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
// 鏀惰棌鎸夐挳
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)
+ if (collectResourceList.value.findIndex((item) => item.id == id) > -1) {
+ collectResourceList.value = collectResourceList.value.filter((item) => item.id != id)
} else {
collectResourceList.value.push({
id,
@@ -1955,11 +2501,11 @@
MG.identity.setUserKey({
setKeyRequests: [
{
- domain: "collectResource",
+ domain: 'collectResource',
key: bookConfig.value.bookId,
- value: JSON.stringify(collectResourceList.value),
- },
- ],
+ value: JSON.stringify(collectResourceList.value)
+ }
+ ]
})
}
@@ -2017,7 +2563,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
@@ -2049,14 +2595,13 @@
.then(() => {
router.push('/login')
})
- .catch(() => { })
+ .catch(() => {})
}
}
//閿欓鏈�
const wrongQuestionVisble = ref(false)
const selectExercisesType = (type) => {
-
if (type == 'exercises') {
getExercisesList()
exercisesType.value = type
@@ -2099,6 +2644,7 @@
const menuItemClick = (name) => {
searchText.value = ''
allSearchReault.value = []
+ listLoading.value = false
if (menuState.open && activeMenu.value == name) {
menuState.open = false
} else {
@@ -2145,7 +2691,6 @@
// }
}
-const searchText = ref<string>('') //绛涢��
const menuState = reactive({
open: true,
notesColor: 'all' //绗旇棰滆壊
@@ -2280,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) => {
@@ -2314,7 +2858,8 @@
}
})
}
- console.log(allSearchReault.value, 444)
+ listLoading.value = false
+ }else{
listLoading.value = false
}
}
@@ -2399,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) {
@@ -2428,7 +2975,7 @@
siweiVisble.value = true
break
case '妯″瀷宸ュ叿':
- modelToolVisble.value = true
+ modelTool.value = true
break
case '璇嶅吀':
cidianVisible.value = true
@@ -2439,6 +2986,8 @@
break
case '璁＄畻鍣�':
calculatorVisble.value = true
+ case '鐣寗闂归挓':
+ pomodoroRef.value.setDialogVisable(true)
break
}
} else {
@@ -2457,7 +3006,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
@@ -2487,7 +3036,7 @@
//鐢诲竷鎮诞鎿嶄綔
-let canvas = null
+let canvasBox: any = null
const floatingToolData = reactive({
activeToolData: '', //閫変腑宸ュ叿
activeBookmark: '', //閫変腑涔︾
@@ -2498,6 +3047,10 @@
//鐢诲竷
const canvasShow = ref(false)
+let textBox: any = null
+let activeElBox: any = null
+//鐧芥澘
+const whiteBoard = ref(false)
//鎴浘浜嬩欢
const nameRef = ref()
@@ -2517,7 +3070,6 @@
//娴獥宸ュ叿鏍忕偣鍑讳簨浠�
const floatItemHandle = (item) => {
- console.log(floatingToolData.activeToolData, 'floatingToolData.activeToolData')
if (floatingToolData.activeToolData == '鐢荤瑪') {
floatingToolData.activeToolData = ''
} else {
@@ -2525,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
@@ -2556,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
}
}
@@ -2575,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
}
//閫夋嫨鍥惧舰
@@ -2607,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) => {
@@ -2684,7 +3455,7 @@
})
getReMarkList()
})
- .catch(function (error) { })
+ .catch(function (error) {})
}
} else {
ElMessageBox.confirm('璇峰厛鐧诲綍锛�', {
@@ -2702,7 +3473,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
const getReMarkList = () => {
@@ -2748,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))
}
@@ -2828,7 +3598,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
//纭鍥炶皟
@@ -2839,7 +3609,6 @@
}
//鍙栨秷鍥炶皟
const closeFn = (base64: any) => {
- console.log(base64)
floatingToolData.activeToolData = ''
}
//淇濆瓨鎴浘
@@ -2939,7 +3708,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
//鏌ョ湅鎴浘
@@ -2987,7 +3756,7 @@
getScreenshotList()
})
})
- .catch(() => { })
+ .catch(() => {})
}
//閫変腑鏂囧瓧宸ュ叿鏍�
@@ -3086,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
@@ -3123,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
}
@@ -3252,7 +4018,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
@@ -3342,7 +4108,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
@@ -3367,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) => {
@@ -3409,7 +4174,6 @@
})
}
}
- console.log(scribeData.noteList, 'scribeData.noteList')
}
listLoading.value = false
})
@@ -3429,7 +4193,7 @@
})
}
})
- .catch(() => { })
+ .catch(() => {})
}
}
@@ -3483,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
}
@@ -3539,7 +4301,6 @@
//绗旇璺宠浆
const jumpContent = (item) => {
- console.log(item)
if (window.qiankunState && window.qiankunState.gotoPage) {
window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page))
}
@@ -3547,7 +4308,6 @@
//鑿滃崟绗旇缂栬緫
const update = (item) => {
- console.log(item)
dialogToolData.chapter = item.chapterNum
noteColorActive.value = item.color
formData.id = item.id
@@ -3616,7 +4376,7 @@
}
})
})
- .catch(() => { })
+ .catch(() => {})
}
//鑾峰彇閫変腑鑻辨枃璇嶅吀
@@ -3630,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
}
})
@@ -3725,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>
@@ -4325,7 +5111,7 @@
}
.questionList {
- height: 83%
+ height: 83%;
}
.question-bottom {
@@ -4336,7 +5122,6 @@
width: 300px;
padding: 20px 0;
background-color: #fff;
-
li {
cursor: pointer;
width: 65px;
@@ -4478,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;
+ }
+ }
+ }
}
}
@@ -4508,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;
@@ -4884,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,
@@ -4917,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;
@@ -4985,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 {
@@ -5001,4 +5835,8 @@
bottom: 30px;
left: 50px;
}
+.iframe-box {
+ width: 100%;
+ height: 800px;
+}
</style>
--
Gitblit v1.9.1