| | |
| | | <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> |
| | | <!-- 画笔组件 --> |
| | |
| | | <!-- <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') |
| | | //获取路由器 |
| | |
| | | } |
| | | 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 |
| | |
| | | icon: fanqiezhong, |
| | | isShow: bookConfig.value.textbookComponents.indexOf('E4DC9777') > -1 |
| | | } |
| | | // { |
| | | // name: '番茄闹钟', |
| | | // icon: fanqiezhong, |
| | | // isShow: true |
| | | // } |
| | | ] |
| | | floatingToolBox = [ |
| | | { |
| | |
| | | item.icon = '' |
| | | } |
| | | if (resourceType.value == 'default') { |
| | | if (item.isTeacherResource == '否') { |
| | | if (item.isDefaultResource == '是') { |
| | | defaultResourceList.value.push(item) |
| | | } |
| | | } else { |
| | | if (item.isTeacherResource == '是') { |
| | | if (item.isTeacherResource == '是' && item.isDefaultResource == '否') { |
| | | teacherResourceList.value.push(item) |
| | | } |
| | | } |
| | |
| | | // } else if (data.resourcePath) { |
| | | // window.open(bookConfig.value.resourceUrl + '/' + data.resourcePath) |
| | | // } |
| | | } else if (data.resourceType == 'PPT' || data.resourceType == 'PDF') { |
| | | } else if (data.resourceType == 'PPT' || data.resourceType == 'PDF' || data.resourceType == 'WORD') { |
| | | let md5 = data.md5 |
| | | let dataList = [] |
| | | MG.file |
| | |
| | | case '检索': |
| | | allSearchReault.value = [] |
| | | if (window.qiankunState && window.qiankunState.searchBookByKeyword) { |
| | | console.log(window.qiankunState.searchBookByKeyword) |
| | | let searchReault = window.qiankunState.searchBookByKeyword(searchText.value) |
| | | if (searchReault.length > 0) { |
| | | listLoading.value = true |
| | |
| | | break |
| | | } |
| | | } |
| | | |
| | | type pomodoroType = InstanceType<typeof Pomodoro> |
| | | const baiduVisible = ref(false) |
| | | const wendaVisible = ref(false) |
| | | const cidianVisible = 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) { |
| | |
| | | break |
| | | case '计算器': |
| | | calculatorVisble.value = true |
| | | case '番茄闹钟': |
| | | pomodoroRef.value.setDialogVisable(true) |
| | | break |
| | | } |
| | | } else { |
| | |
| | | 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> |
| | | |
| | | <style lang="less"> |
| | |
| | | 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; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |