TextbookReader.git

			@@ -1,29 +1,27 @@
			<template>
			<div class="homeBox">
			<div class="headerBox">
			<!-- <span class="logoTxt">北京师范大学出版集团</span> -->
			<img :src="logo" />

			<img :src="logo" v-if="bookConfig.textbookOwnership == '北京师范大学出版集团'" />
			<!-- <span class="logoTxt" v-else>铁道出版社</span> -->
			<span></span>
			<div class="userInfoBox">
			<div></div>
			<div></div>
			<div class="userName" v-if="userInfo.name">{{userInfo.name}}</div>
			<div><div class="layout hover" @click="layoutBtn">退出</div></div>
			</div>
			</div>
			<div class="contentBox">
			<!-- 菜单 -->
			<div class="menuBox">
			<div
			:class="['menuItem', activeMenu == index ? 'active' : '']"
			v-for="(item, index) in menuData"
			:key="index"
			@click="menuItemClick(index)"
			>
			<div class="menuIcon imgBox">
			<img :src="item.icon" />
			<div v-for="(item, index) in menuData" :key="index" @click="menuItemClick(item.name)">
			<div :class="['menuItem', activeMenu == item.name ? 'active' : '']" v-if="item.isShow">
			<div class="menuIcon imgBox">
			<img :src="item.icon" />
			</div>
			<div class="name">{{ item.name }}</div>
			</div>
			<div class="name">{{ item.name }}</div>
			</div>
			<div class="reload hover" @click="reload()">刷新</div>
			<!-- <div class="reload hover" @click="reload()">刷新</div> -->
			<!-- 设置 -->
			<el-popover placement="right" :width="300" trigger="click">
			<div class="settingBox">
			@@ -49,14 +47,14 @@
			</div>
			</div>
			</el-form-item>
			<div class="inline">
			<!-- <div class="inline">
			<el-form-item label="答题音效">
			<el-switch v-model="settingForm.acoustics" />
			</el-form-item>
			<el-form-item label="答题动画">
			<el-switch v-model="settingForm.animation" />
			</el-form-item>
			</div>
			</div> -->
			<el-form-item label="底色">
			<div class="bgColor">
			<div
			@@ -91,10 +89,18 @@
			<!-- 菜单内容 -->
			<div class="menuContent" v-if="menuState.open">
			<div class="searchBox">
			<div class="inputBox" v-if="activeMenu !== 2">
			<el-input class="custom-input" placeholder="请输入内容" v-model="searchText">
			<div class="inputBox" v-if="activeMenu !== '资源'">
			<el-input
			class="custom-input"
			placeholder="请输入内容"
			v-model="searchText"
			@keyup.enter="searchBook"
			>
			<template #prefix>
			<el-icon @click="searchBook"><Search /></el-icon>
			<el-icon><Search /></el-icon>
			</template>
			<template #suffix>
			<svg @click="searchBook" 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-list-search hover"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 15m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0" /><path d="M18.5 18.5l2.5 2.5" /><path d="M4 6h16" /><path d="M4 12h4" /><path d="M4 18h4" /></svg>
			</template>
			</el-input>
			</div>
			@@ -111,21 +117,30 @@
			</div>
			</div>
			<!-- 目录 -->
			<div class="menuList" v-if="activeMenu == 0">
			<div class="menuList" v-if="activeMenu == '目录'">
			<el-tree
			style="max-width: 600px"
			ref="catalogTree"
			default-expand-all="true"
			:expand-on-click-node="false"
			:data="catalogueData"
			:props="defaultProps"
			v-if="catalogueData.length > 0"
			@node-click="handleNodeClick"
			/>
			<div v-if="catalogueData.length == 0">
			:filter-node-method="filterNode"
			>
			<template #default="{ node, data }">
			<div class="custom-tree-node">
			<div class="catalogueLabel" :title="node.label">{{ node.label }}</div>
			<span class="pageNum">{{ data.page }}</span>
			</div>
			</template>
			</el-tree>
			<div v-else>
			<el-empty :image-size="60" description="暂无数据" />
			</div>
			</div>
			<!-- 笔记 -->
			<div class="notesBox" v-if="activeMenu == 1">
			<div class="notesBox" v-if="activeMenu == '笔记'">
			<div class="screenBox">
			<div class="title">筛选</div>
			<div class="flex1 hover" @click="searchClick('all')">
			@@ -144,53 +159,59 @@
			</div>
			</div>
			<div class="list-box">
			<div v-if=" scribeData.noteList.length > 0">
			<div v-for="(item, index) in scribeData.noteList" :key="item.key" class="listItem">
			<div class="textBox">
			<div class="title">
			<div class="title-con">
			<div class="border-left" :style="{ 'border-right-color': item.color }"></div>
			<span>{{ item.createDate }}</span>
			<div v-if="scribeData.noteList.length > 0">
			<div v-for="(noteItem, index) in scribeData.noteList" :key="noteItem">
			<div class="chapterName">{{ noteItem.chapterName }}</div>
			<div v-for="(item, index) in noteItem.noteList" :key="item.key" class="listItem">
			<div class="textBox">
			<div class="title">
			<div class="title-con">
			<div
			class="border-left"
			:style="{ 'border-right-color': item.color }"
			></div>
			<span>{{ moment(item.createDate).format('YYYY-MM-DD') }}</span>
			</div>
			<div>
			<img :src="bianji" @click="update(item)" class="hover" />
			<img :src="shanchu" @click="deleteBtn(item)" class="hover" />
			</div>
			</div>
			<div>
			<img :src="bianji" @click="update(item)" />
			<img :src="shanchu" @click="deleteBtn(item)" />
			<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>
			</div>
			<div class="chapter">{{ item.txt }}</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="con hover">
			{{ item.note }}
			</div>
			</div>
			<div class="chapter">{{ item.txt }}</div>
			</div>
			</div>
			</div>
			<div v-if=" scribeData.noteList.length == 0">
			<div v-if="scribeData.noteList.length == 0">
			<el-empty :image-size="60" description="暂无数据" />
			</div>
			</div>
			</div>
			<!-- 资源 -->
			<div class="" v-if="activeMenu == 2">
			<div class="resourceBox">
			<div class="" v-if="activeMenu == '资源'">
			<div class="resourceBox" v-if="classifySelectList.length > 0">
			<div class="classification">
			<div
			v-for="item in classifySelectList"
			@@ -214,9 +235,17 @@
			</div>
			</div>
			<div class="inputBox" v-if="!searchShow">
			<el-input class="custom-input" placeholder="请输入内容" v-model="searchText">
			<el-input
			class="custom-input"
			placeholder="请输入内容"
			v-model="searchText"
			@keyup.enter="searchBook"
			>
			<template #prefix>
			<el-icon @click="searchBook" class="hover"><Search /></el-icon>
			<el-icon><Search /></el-icon>
			</template>
			<template #suffix>
			<svg @click="searchBook" 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-list-search hover"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 15m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0" /><path d="M18.5 18.5l2.5 2.5" /><path d="M4 6h16" /><path d="M4 12h4" /><path d="M4 18h4" /></svg>
			</template>
			</el-input>
			</div>
			@@ -233,21 +262,12 @@
			<el-icon v-else-if="activeClassify == 'video'" size="30"
			><VideoCamera
			/></el-icon>
			<el-icon
			v-else-if="activeClassify == 'other' && item.fileType == 'PDF'"
			size="30"
			><Files
			/></el-icon>
			<el-icon
			v-else-if="activeClassify == 'other' && item.fileType == ''"
			size="30"
			<el-icon v-else-if="activeClassify == 'other'" size="30"><Files /></el-icon>
			<el-icon v-else-if="activeClassify == 'exercises'" size="30"
			><Tickets
			/></el-icon>
			</div>
			<div class="rName" v-if="searchText != ''" v-html="item.name"></div>
			<div class="rName" v-else :title="item.resourceName">
			{{ item.resourceName }}
			</div>
			<div class="rName" :title="item.resourceName">{{ item.resourceName }}</div>
			</div>
			</el-col>
			</el-row>
			@@ -258,7 +278,7 @@
			</div>
			</div>
			<!-- 知识图谱 -->
			<div class="" v-if="activeMenu == 3">
			<div class="" v-if="activeMenu == '知识图谱'">
			<div class="list-box">
			<div>
			<el-empty :image-size="60" description="暂无数据" />
			@@ -266,19 +286,20 @@
			</div>
			</div>
			<!-- 截图 -->
			<div class="" v-if="activeMenu == 4">
			<div class="" v-if="activeMenu == '截图'">
			<div class="list-box">
			<div class="screenshot" v-if="screenshotList.length > 0">
			<div v-for="(item, index) in screenshotList" :key="item" class="captureItem">
			<div class="imgBox">
			<img
			:src="item.imgUrl"
			class="capture"
			mode="aspectFill"
			@click="getCapture(item)"
			/>
			<div class="deleteBox hover" @click="deleteScreenshot(item, 'capture')">
			<img :src="shanchu" />
			<div class="imgBox" @mouseover="showDelete = index" @mouseleave="showDelete = null">
			<img :src="item.imgUrl" class="capture hover" mode="aspectFill" />
			<div class="deleteBox" v-if="showDelete == index">
			<div class="delImg">
			<el-icon @click="getCapture(item, index)" size="18" class="icon hover"
			><View
			/></el-icon>
			<img :src="bianji" class="icon hover" @click="updateScreenshot(item)" />
			<img :src="shanchu" class="icon hover" @click="deleteScreenshot(item)" />
			</div>
			</div>
			</div>
			<div class="captureName" :title="item.name">{{ item.name }}</div>
			@@ -290,51 +311,61 @@
			</div>
			</div>
			<!-- 标签 -->
			<div class="" v-if="activeMenu == 5">
			<div class="" v-if="activeMenu == '书签'">
			<div class="list-box">
			<div>
			<div v-if="reMarkList.length > 0">
			<div v-for="(item, index) in reMarkList" :key="index" class="reMarkItem">
			<div class="reMarkCon">{{ item.chapterName }} 第{{ item.page }}页</div>
			<div class="deleteReMarkImg">
			<img :src="shanchu" class="icon hover" @click="deleteReMark(item)" />
			</div>
			</div>
			</div>
			<div v-else>
			<el-empty :image-size="60" description="暂无数据" />
			</div>
			</div>
			</div>
			<!-- 菜单内容收起 -->
			<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"><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>
			<!-- <img :src="shouqiL" @click="menuState.open = false" /> -->
			</div>
			</div>
			<!-- 菜单内容收起 -->
			<div class="menuStateBox" v-if="menuState.open">
			<img :src="shouqiL" @click="menuState.open = false" />
			</div>

			<!-- 中间内容 -->
			<div class="pageBox">
			<!-- 头部显示 -->
			<div class="pageBox-header">
			<div class="classTime">
			<div class="qureIcon"></div>
			<div class="">已上课：{{ headerData.classTime }}</div>
			<!-- <div class="classTime"> -->
			<div style="width: 150px">
			<!-- <div class="qureIcon"></div>
			<div class="">已上课：{{ headerData.classTime }}</div> -->
			</div>
			<div class="progress">
			<div class="bookName">{{ bookName }}</div>
			<div>{{ headerData.process }}%</div>
			<div class="bookName">{{ bookConfig.bookName }}</div>
			<div v-if="headerData.totlePage && bookConfig.bookName">
			{{ headerData.process }}/{{ headerData.totlePage }}
			</div>
			</div>
			<div class="rightBox">
			<div class="pageSizeBox">
			<div><img :src="zoomIn" @click="changePageSize('add')" /></div>
			<div>{{ headerData.pageSize }}%</div>
			<div><img :src="zoomOut" @click="changePageSize('reduce')" /></div>
			<div>{{ headerData.pageSize }}%</div>
			<div><img :src="zoomIn" @click="changePageSize('add')" /></div>
			</div>
			<div class="brushImgBox">
			<!-- <div class="brushImgBox">
			<div @click="jumpContent('note' + index)">
			<img :src="huabi2" class="brushImg" />画笔
			</div>
			</div>
			</div> -->
			</div>
			</div>
			<!-- 微应用盒子 -->
			<div class="pageBox-content">
			<div class="content-box">
			<div
			id="container"
			@mousedown="handleMouseDown"
			@mousemove="handleMousemove"
			:style="{ background: settingForm.bgColorActive }"
			id="container" :style="{ background: settingForm.bgColorActive }"
			></div>
			<!-- 画笔画布 -->
			<div class="canvas-box" v-show="canvasShow">
			@@ -342,132 +373,11 @@
			</div>
			</div>
			</div>
			</div>
			<!-- 教学组件 -->
			<div class="toolBox">
			<div class="toolTitle">
			<span>{{ toolState.open ? '教学组件' : '组件' }}</span>
			<div class="text"></div>
			</div>
			<div class="menuList">
			<ul class="menu">
			<li
			v-for="item in teachToolsMenuData"
			:key="item.key"
			:class="item.name === activeTool ? 'activeItem hover' : 'menuItem hover'"
			:style="!toolState.open ? 'padding:10px 15px' : ''"
			@click="selectTeachTools(item)"
			>
			<img :src="item.icon" alt="" />
			<span v-if="toolState.open">{{ item.name }}</span>
			</li>
			</ul>
			</div>
			<div :class="['openBox', toolState.open ? 'right' : '']">
			<img :src="shouqiR" v-if="toolState.open" @click="toolState.open = false" />
			<img :src="shouqiL" v-if="!toolState.open" @click="toolState.open = true" />
			</div>
			<div class="classRoomBox" v-if="toolState.open">
			<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
			<el-tab-pane label="备课组件" name="first">
			<div class="tabBox">
			<div class="insertSelect">
			<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')"
			>
			<img :src="selectType == 'answer' ? dati_charu_blue : dati_charu" />
			<div>插入答题</div>
			</div>
			</div>
			</div>
			</el-tab-pane>
			<el-tab-pane label="上课组件" name="second">
			<div class="tabBox">
			<div class="giveLessons hover" @click="giveLessonsClick()">
			<img :src="xiake" />
			<span>{{ classStart ? '上课' : '下课' }}</span>
			</div>
			</div>
			</el-tab-pane>
			</el-tabs>
			</div>
			</div>
			<!-- 画笔工具栏 -->
			<div
			draggable="true"
			class="draggableBox"
			@dragstart="dragstart($event)"
			@dragend="dragend($event)"
			:style="`left:${floatingToolData.elLeft}px;top:${floatingToolData.elTop}px`"
			>
			<!-- 画笔组件 -->
			<div
			class="hover"
			v-for="item in floatingToolBox"
			:key="item.name"
			@click="floatItemHandle(item)"
			@mouseover="floatOverHander(item)"
			@mouseout="floatOutHander(item)"
			>
			<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')">
			<img :src="hide" />
			<div>隐藏</div>
			</div>
			<div class="labelItem hover" @click="labelShow('show')">
			<img :src="show" />
			<div>显示</div>
			</div>
			</div>
			</div>
			<template #reference>
			<div
			:class="
			floatingToolData.activeToolData == item.name
			? 'floatToolActive floatToolItem'
			: 'floatToolItem'
			"
			>
			<img
			:src="floatingToolData.activeToolData == item.name ? item.activeIcon : item.icon"
			alt=""
			/>
			<div class="text">{{ item.name }}</div>
			</div>
			</template>
			</el-popover>
			<div
			:class="
			floatingToolData.activeToolData == item.name
			? 'floatToolActive floatToolItem'
			: 'floatToolItem'
			"
			v-else
			@click="floatItemHandle(item)"
			>
			<img
			:src="floatingToolData.activeToolData == item.name ? item.activeIcon : item.icon"
			alt=""
			/>
			<div class="text">{{ item.name }}</div>
			</div>
			</div>
			</div>
			<div class="brushBox" v-if="floatingToolData.activeToolData == '画笔'">
			class="brushBox"
			v-if="floatingToolData.activeToolData == '画笔'"
			>
			<div class="toolList">
			<el-popover placement="top" width="250" trigger="click">
			<div class="popinnerBox">
			@@ -531,35 +441,50 @@
			</div>
			</div>
			<template #reference>
			<div class="floatToolItem" @click="toolSelectHandle('huabi')">
			<div class="imgBox">
			<img :src="hide" alt="" />
			</div>
			<div class="text">画笔</div>
			<div class="floatToolItem hover" @click="toolSelectHandle('huabi')">
			<el-tooltip class="box-item" effect="dark" content="画笔" placement="bottom">
			<img :src="huabi2" alt="" class="imgBox"/>
			</el-tooltip>
			<!-- <div class="text">画笔</div> -->
			</div>
			</template>
			</el-popover>
			<el-popover placement="top" width="250" trigger="click">
			<div class="popinnerBox">
			<div class="write">
			<div class="characters">
			<div class="lineStyle">
			<div class="lineTypeBox">
			<div
			:class="toolSelectData.fontSizeActive == '14' ? 'small active' : 'small'"
			: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' ? 'middle active' : 'middle'"
			: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' ? 'large active' : 'large'"
			:class="
			toolSelectData.fontSizeActive == '18' ? 'typeItem lineTypeActive' : 'typeItem'
			"
			@click="selectfontSize('18')"
			>
			大
			<div class="activeIcon" v-if="toolSelectData.fontSizeActive == '18'">
			<img :src="xuanzhong" />
			</div>
			</div>
			</div>
			<div class="lineStyle">
			@@ -579,35 +504,28 @@
			</div>
			</div>
			<template #reference>
			<div class="floatToolItem" @click="toolSelectHandle('wenzi')">
			<div class="imgBox">
			<img :src="wenzi2" alt="" />
			</div>
			<div class="text">文字</div>
			<div class="floatToolItem hover" @click="toolSelectHandle('wenzi')">
			<el-tooltip class="box-item" effect="dark" content="文字" placement="bottom">
			<img :src="wenzi2" alt="" class="imgBox"/>
			</el-tooltip>
			</div>
			</template>
			</el-popover>
			<el-popover placement="top" width="250" trigger="click">
			<div class="popinnerBox">
			<div class="write">
			<div class="characters">
			<div
			:class="floatingToolData.fontSizeActive == '14' ? 'small active' : 'small'"
			@click="selectfontSize('14')"
			>
			小
			<div class="graphBox">
			<div class="graphSelect">
			<div class="flex1">
			<div class="square hover" @click="graphSelect('square')"></div>
			</div>
			<div
			:class="toolSelectData.fontSizeActive == '16' ? 'middle active' : 'middle'"
			@click="selectfontSize('16')"
			>
			中
			<div class="flex1">
			<div class="rotundity hover" @click="graphSelect('rotundity')"></div>
			</div>
			<div
			:class="toolSelectData.fontSizeActive == '18' ? 'large active' : 'large'"
			@click="selectfontSize('18')"
			>
			大
			<div class="flex1">
			<div class="triangle hover" @click="graphSelect('triangle')"></div>
			</div>
			<div class="flex1">
			<div class="lineSegment hover" @click="graphSelect('lineSegment')">/</div>
			</div>
			</div>
			<div class="lineStyle">
			@@ -627,46 +545,173 @@
			</div>
			</div>
			<template #reference>
			<div class="floatToolItem" @click="toolSelectHandle('tuxing')">
			<div class="imgBox">
			<img :src="tuxing" alt="" />
			</div>
			<div class="text">图形</div>
			<div class="floatToolItem hover" @click="toolSelectHandle('tuxing')">
			<el-tooltip class="box-item" effect="dark" content="图形" placement="bottom">
			<img :src="tuxing" alt="" class="imgBox"/>
			</el-tooltip>
			</div>
			</template>
			</el-popover>
			<div class="floatToolItem" @click="toolSelectHandle('xiangpi')">
			<div class="imgBox">
			<img :src="clearPrevious" alt="" />
			</div>
			<div class="text">橡皮擦</div>
			</div>
			<div class="floatToolItem" @click="toolSelectHandle('chexiao')">
			<!-- <div class="floatToolItem" @click="toolSelectHandle('xiangpi')">
			<div class="imgBox">
			<img :src="clear" alt="" />
			</div>
			<div class="text">撤销</div>
			<div class="text">橡皮擦</div>
			</div> -->
			<div class="floatToolItem hover" @click="toolSelectHandle('chexiao')">
			<el-tooltip class="box-item" effect="dark" content="撤销" placement="bottom">
			<img :src="clearPrevious" alt="" class="imgBox"/>
			</el-tooltip>
			</div>
			<div class="floatToolItem" @click="toolSelectHandle('chongzuo')">
			<!-- <div class="floatToolItem" @click="toolSelectHandle('chongzuo')">
			<div class="imgBox">
			<img :src="hide" alt="" />
			<img :src="chongzuo" alt="" />
			</div>
			<div class="text">重做</div>
			</div> -->
			<div class="floatToolItem hover" @click="toolSelectHandle('qingchu')">
			<el-tooltip class="box-item" effect="dark" content="清除" placement="bottom">
			<img :src="qingchu2" alt="" class="imgBox"/>
			</el-tooltip>
			</div>
			<div class="floatToolItem" @click="toolSelectHandle('qingchu')">
			<div class="imgBox">
			<img :src="hide" alt="" />
			</div>
			<div class="text">清除</div>
			</div>
			<div class="floatToolItem layOutTool" @click="toolSelectHandle('tuichu')">
			<div class="imgBox">
			<img :src="tuichu" alt="" />
			</div>
			<div class="text">退出</div>
			<div class="layOutTool"></div>
			<div class="floatToolItem hover" @click="toolSelectHandle('tuichu')">
			<el-tooltip class="box-item" effect="dark" content="退出" placement="bottom">
			<img :src="tuichu" alt="" class="imgBox"/>
			</el-tooltip>
			</div>
			</div>
			</div>
			</div>
			<!-- 教学组件 -->
			<div class="toolBox">
			<div class="toolTitle">
			<span>{{ toolState.open ? '学习组件' : '组件' }}</span>
			<div class="text"></div>
			</div>
			<div class="menuList">
			<ul class="menu" v-if="teachToolsMenuData.length > 0">
			<li v-for="item in teachToolsMenuData" :key="item.key">
			<div
			:class="item.name === activeTool ? 'activeItem hover' : 'menuItem hover'"
			: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' : '']">
			<!-- <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"><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"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 12l-10 0" /><path d="M14 12l-4 4" /><path d="M14 12l-4 -4" /><path d="M20 4l0 16" /></svg>
			</div>
			<div class="classRoomBox" v-if="false">
			<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
			<el-tab-pane label="备课组件" name="first">
			<div class="tabBox">
			<div class="insertSelect">
			<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')"
			>
			<img :src="selectType == 'answer' ? dati_charu_blue : dati_charu" />
			<div>插入答题</div>
			</div>
			</div>
			</div>
			</el-tab-pane>
			<el-tab-pane label="上课组件" name="second">
			<div class="tabBox">
			<div class="giveLessons hover" @click="giveLessonsClick()">
			<img :src="xiake" />
			<span>{{ classStart ? '上课' : '下课' }}</span>
			</div>
			</div>
			</el-tab-pane>
			</el-tabs>
			</div>
			</div>
			<!-- 画笔工具栏 -->
			<div
			draggable="true"
			class="draggableBox"
			:style="`left:${floatingToolData.elLeft}px`"
			v-if="floatingToolBox.length > 0"
			>
			<div
			class="hover"
			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 == '标记'"
			>
			<div class="popinnerBox">
			<div class="label" v-if="floatingToolData.activeToolData == '标记'">
			<div class="labelItem hover" @click="labelShow('hide')">
			<img :src="hide" />
			<div>隐藏</div>
			</div>
			<div class="labelItem hover" @click="labelShow('show')">
			<img :src="show" />
			<div>显示</div>
			</div>
			</div>
			</div>
			<template #reference>
			<div
			:class="
			floatingToolData.activeToolData == item.name
			? 'floatToolActive floatToolItem'
			: 'floatToolItem'
			"
			>
			<el-tooltip
			class="box-item"
			effect="dark"
			:content="item.name"
			placement="right"
			>
			<img :src="item.icon" alt="" />
			</el-tooltip>
			<!-- <div class="text">{{ item.name }}</div> -->
			</div>
			</template>
			</el-popover>
			<div
			:class="
			floatingToolData.activeToolData == item.name
			? 'floatToolActive floatToolItem'
			: 'floatToolItem'
			"
			v-else
			>
			<el-tooltip class="box-item" effect="dark" :content="item.name" placement="right">
			<img :src="item.icon" alt="" />
			</el-tooltip>
			<!-- <div class="text">{{ item.name }}</div> -->
			</div>
			</div>
			</div>
			</div>

			<!-- 选中工具栏 -->
			<div
			class="dialogToolBox"
			@@ -688,15 +733,16 @@
			</div>
			<div class="toolSelectBox" v-show="!(toolActive == '高亮' \|\| toolActive == '划线')">
			<div
			:class="item.name == toolActive ? 'dialogToolItem active' : 'dialogToolItem'"
			v-for="item in dialogToolList"
			:key="item.icon"
			@click="dialogToolHandle(item)"
			@mouseover="dialogOverHander(item)"
			@mouseout="dialogOutHander(item)"
			>
			<img :src="item.name == toolActive ? item.activeIcon : item.icon" alt="" />
			<span>{{ item.name }}</span>
			<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>
			</div>
			<!-- <span>{{ item.name }}</span> -->
			</div>
			</div>
			</div>
			@@ -708,7 +754,12 @@
			v-show="lineDelete.showLineDelete"
			:style="{ top: `${lineDelete.top}px`, left: `${lineDelete.left}px` }"
			>
			<el-button @click="delUserKey">删除</el-button>
			<!-- <el-button @click="delUserKey">删除</el-button> -->
			<div class="dialogToolItem">
			<el-tooltip class="box-item" effect="dark" content="删除" placement="bottom">
			<img :src="trash" @click="delUserKey"/>
			</el-tooltip>
			</div>
			</div>

			<el-dialog title="资源" align-center v-model="resourVisble" width="845" class="resourDialog">
			@@ -719,6 +770,14 @@
			<vue-office-docx :src="testWord" />
			</div>
			</el-dialog>
			<!-- 图片 -->
			<el-image-viewer
			v-if="confirmDialog"
			:zoom-rate="1.2"
			@close="closePreview"
			:initial-index="previewIndex"
			:url-list="imgPreviewList"
			/>
			<el-dialog
			title="添加笔记"
			align-center
			@@ -749,21 +808,10 @@
			<template #footer>
			<span class="dialog-footer">
			<el-button @click="handleClose">取消</el-button>
			<el-button type="primary" @click="addUserKey">确定</el-button>
			<el-button type="primary" @click="addUserKey" v-if="!isUpdate">确定</el-button>
			<el-button type="primary" @click="updateUserKey" v-if="isUpdate">确定</el-button>
			</span>
			</template>
			</el-dialog>
			<el-dialog
			align-center
			v-model="confirmDialog"
			width="60%"
			:closeOnClickModal="false"
			title="图片"
			class="resourDialog"
			>
			<div class="imgUrlBox">
			<img :src="imgUrl" mode="aspectFill" />
			</div>
			</el-dialog>
			<el-dialog
			title="保存截图"
			@@ -779,16 +827,18 @@
			<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>
			<el-dialog title="百度百科" align-center v-model="baiduVisible" width="60%" class="myDialogs">
			<el-dialog title="百度百科" align-center v-model="baiduVisible" width="80%" class="baiduDialog">
			<div class="wendabox">
			<iframe :src="'https://baike.baidu.com/item/' + selectText" frameborder="0"></iframe>
			<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="26%" class="myDialogs">
			<el-dialog title="AI智能问答" align-center v-model="wendaVisible" width="60%" class="myDialogs">
			<div class="wendabox">
			<iframe src="https://yiyan.baidu.com/" frameborder="0"></iframe>
			</div>
			@@ -796,14 +846,14 @@
			<el-dialog title="词典" align-center v-model="cidianVisible" width="60%" class="myDialogs">
			<div class="wendabox">
			<!-- <iframe src="https://www.vocabulary.com/" frameborder="0"></iframe> -->
			<dictionary :searchCon="selectText" />
			<dictionary :searchCon="dialogToolData.txt" />
			</div>
			</el-dialog>
			<el-dialog
			title="GGB函数工具"
			align-center
			v-model="functionVisible"
			width="60%"
			width="80%"
			class="myDialogs"
			>
			<div class="wendabox">
			@@ -824,11 +874,11 @@

			<script setup lang="ts">
			import { ref, reactive, watch, onMounted, onBeforeMount, inject } from 'vue'
			import { ctxUrl, resourceUrl, requestCtx } from '@/assets/js/config'
			import { ctxUrl } from '@/assets/js/config'
			import { useRouter, useRoute } from 'vue-router'
			import useClipboard from 'vue-clipboard3'
			const { toClipboard } = useClipboard()
			const request = inject('request')
			const MG: any = inject('MG')
			const toolClass = inject('toolClass')
			const qiankunActions = inject('qiankunActions')
			//获取路由器
			@@ -870,27 +920,19 @@
			import dati_charu_blue from '../assets/images/operation/dati_charu_blue.png'
			import xiake from '../assets/images/operation/xiake.png'

			import huabi from '../assets/images/operation/huabi-w.png'
			import huabi1 from '../assets/images/operation/huabi-b.png'
			import qingchu from '../assets/images/operation/Clearaway-w.png'
			import qingchu1 from '../assets/images/operation/Clearaway-b.png'
			import wenzi from '../assets/images/operation/wenzi-w.png'
			import wenzi1 from '../assets/images/operation/wenzi-b.png'
			import huabi from '../assets/images/operation/brush.svg'
			import wenzi2 from '../assets/images/operation/wenzi.png'
			import biaoqianw from '../assets/images/operation/biaoqian-w.png'
			import biaoqian1 from '../assets/images/operation/biaoqian-b.png'
			import baiban from '../assets/images/operation/baiban-w.png'
			import baiban1 from '../assets/images/operation/baiban-b.png'
			import biaozhu from '../assets/images/operation/biaozhu-w.png'
			import biaozhu1 from '../assets/images/operation/biaozhu-b.png'
			import jieping from '../assets/images/operation/screenshot-w.png'
			import jieping1 from '../assets/images/operation/screenshot-b.png'
			import clear from '../assets/images/operation/clear.png'
			import biaoqianw from '../assets/images/operation/bookmark-plus.svg'
			import baiban from '../assets/images/operation/chalkboard.svg'
			import biaozhu from '../assets/images/operation/pencil-minus.svg'
			import jieping from '../assets/images/operation/crop.svg'
			import clearPrevious from '../assets/images/operation/clearPrevious.png'
			import hide from '../assets/images/operation/hide.png'
			import show from '../assets/images/operation/show.png'
			import tuichu from '../assets/images/operation/tuichu.png'
			import tuxing from '../assets/images/operation/tuxing.png'
			import chongzuo from '../assets/images/operation/chongzuo.png'
			import qingchu2 from '../assets/images/operation/qingchu.png'

			import gaoliang from '../assets/images/operation/gaoliang.png'
			import gaoliang1 from '../assets/images/operation/gaoliang-b.png'
			@@ -916,6 +958,7 @@
			import zoomIn from '../assets/images/operation/zoomIn.png'
			import zoomOut from '../assets/images/operation/zoomOut.png'
			import huabi2 from '../assets/images/operation/huabi.svg'
			import trash from '../assets/images/operation/trash.svg'

			import shanchu from '../assets/images/operation/delete.png'
			import bianji from '../assets/images/operation/bianji.png'
			@@ -937,14 +980,12 @@
			const screenWidth = ref(
			window.innerWidth \|\| document.documentElement.clientWidth \|\| document.body.clientWidth
			)

			let userInfo = ref({})
			let microApp = null // 微应用实例
			const bookName = ref('')
			const bookId = ref(1)
			const bookConfig = ref({})
			const activeCatalog = ref()
			onMounted(() => {
			getCatalogueData()
			getResourceData()
			getUserInfo()
			setTimeout(() => {
			canvasWith.value = document.querySelector('.content-box').offsetWidth
			canvasheight.value = document.querySelector('.content-box').offsetHeight
			@@ -952,6 +993,9 @@
			if (screenWidth.value < 1180) {
			menuState.open = false
			toolState.open = false
			if (!menuState.open) {
			floatingToolData.elLeft = 90
			}
			}
			window.onresize = () => {
			return (() => {
			@@ -971,8 +1015,6 @@

			window.qiankunActions.onGlobalStateChange((state, prev) => {
			console.log('父层state变化', state)
			bookName.value = state.bookName
			bookId.value = state.bookId
			window.qiankunState = state
			})

			@@ -980,14 +1022,26 @@
			console.log(window.qiankunActions)
			window.qiankunActions.setGlobalState({
			state: 1, // 加载子应用
			bookId: localStorage.getItem('bookId'),
			windowSelection: (data) => {
			// 绑定子应用选择监听事件
			console.log(data, '子应用选择')
			if(data.txt){
			if (data.txt) {
			getSelection(data)
			}else{
			} else {
			showToolBox.value = false
			lineDelete.showLineDelete = false
			toolActive.value = ''
			lineDelete.top = data.y + 20
			lineDelete.left = data.x
			}
			},
			getBookConfig: (data) => {
			console.log(data, '图书配置')
			bookConfig.value = data.bookConfig
			getCatalogueData()
			getResourceData()
			getTextbookComponents()
			},
			catalogChange: (data) => {
			activeCatalog.value = data.showCatalogList
			@@ -995,19 +1049,15 @@
			console.log(data, '章节切换：目前显示的三个章节')
			},
			pageChange: (data) => {
			// {
			// page: 100,
			// catalog: 5,
			// catalogId: "",
			// catalogName: "",
			// }
			headerData.process = Number(data.page)
			currentChapter.value = data.catalog
			console.log(data, '页面切换：目前显示页面和对应的章节信息')
			},

			}
			})
			// 调用子层方法
			// if (window.qiankunState && window.qiankunState.aa) window.qiankunState.aa(1)
			})


			watch(
			() => screenWidth.value,
			@@ -1016,28 +1066,196 @@
			if (screenWidth.value < 1180) {
			menuState.open = false
			toolState.open = false
			if (!menuState.open) {
			floatingToolData.elLeft = 90
			}
			} else {
			}
			}
			)
			watch(
			() => bookId.value,
			(val) => {
			// getNotesList() // 获取笔记
			// getlineHeightList() //获取高亮
			// getScribeList() //获取划线
			// getScreenshotList() //截图
			}
			)


			const getUserInfo = () => {
			MG.identity.getCurrentAppUser().then((res) => {
			console.log(res, '用户信息')
			if(res){
			let teacherRole = res.roleLinks.find((item) => item.role.refCode == 'teacher')
			let teacherInfos = res.infoList.find((item) => item.type == 'teacherInfo')
			let phoneInfo = res.secretList.find((item) => item.type == 'MobilePhone')
			let nameAndPassword = res.secretList.find((item) => item.type == 'LoginNameAndPassword')

			if (nameAndPassword) {
			userInfo.value = {
			name: nameAndPassword.credential,
			}
			localStorage.setItem('userInfo', JSON.stringify(userInfo.value))
			}else if(teacherRole && teacherInfos){
			userInfo.value = {
			name: teacherInfos.name,
			role: 'Teacher',
			roleId: teacherRole.role.id
			}
			localStorage.setItem('userInfo', JSON.stringify(userInfo.value))
			} else if(phoneInfo){
			userInfo.value = {
			name: phoneInfo.credential,
			}
			localStorage.setItem('userInfo', JSON.stringify(userInfo.value))
			}

			}
			})
			}


			let menuData = [] //菜单
			let teachToolsMenuData = [] //右侧学习组件
			let floatingToolBox = [] //中间悬浮组件
			let dialogToolList =[] //选中文字操作
			//获取当前书籍所需组件
			const getTextbookComponents = () => {
			menuData = []
			teachToolsMenuData = []
			floatingToolBox = []
			menuData = [
			{
			name: '目录',
			icon: mulu,
			isShow: bookConfig.value.textbookComponents.indexOf('1E16353F') > -1
			},
			{
			name: '笔记',
			icon: biji,
			isShow: bookConfig.value.textbookComponents.indexOf('A3298FCF') > -1
			},
			{
			name: '资源',
			icon: ziyuan,
			isShow: bookConfig.value.textbookComponents.indexOf('A04689E6') > -1
			},
			{
			name: '知识图谱',
			icon: zhishitupu,
			isShow: bookConfig.value.textbookComponents.indexOf('6BE6A3DC') > -1
			},
			{
			name: '截图',
			icon: jietu,
			isShow: bookConfig.value.textbookComponents.indexOf('CB0EACEC') > -1
			},
			{
			name: '书签',
			icon: biaoqian,
			isShow: bookConfig.value.textbookComponents.indexOf('CF2E1400') > -1
			}
			]
			teachToolsMenuData = [
			{
			name: 'AI智能问答',
			icon: aIzhinengwenda,
			isShow: bookConfig.value.textbookComponents.indexOf('E30C0843') > -1
			},
			{
			name: '词典',
			icon: cidian,
			isShow: bookConfig.value.textbookComponents.indexOf('83FB80FD') > -1
			},
			{
			name: '生字卡片',
			icon: shengzikapian,
			isShow: bookConfig.value.textbookComponents.indexOf('38D32EE3') > -1
			},
			{
			name: '互动问答',
			icon: hudongwenda,
			isShow: bookConfig.value.textbookComponents.indexOf('31F123A4') > -1
			},
			{
			name: '思维导图',
			icon: siweidaotu,
			isShow: bookConfig.value.textbookComponents.indexOf('94FF5E48') > -1
			},
			{
			name: 'GGB函数工具',
			icon: GGB,
			isShow: bookConfig.value.textbookComponents.indexOf('43C805B2') > -1
			},
			{
			name: '几何工具',
			icon: jihe,
			isShow: bookConfig.value.textbookComponents.indexOf('FFFED2EF') > -1
			},
			{
			name: 'Python',
			icon: python,
			isShow: bookConfig.value.textbookComponents.indexOf('1D48E00E') > -1
			},
			{
			name: 'C++',
			icon: cjiajia,
			isShow: bookConfig.value.textbookComponents.indexOf('8E953BF7') > -1
			},
			{
			name: 'Javascript',
			icon: javascript,
			isShow: bookConfig.value.textbookComponents.indexOf('25AC6CC2') > -1
			},
			{
			name: '模型工具',
			icon: moxinggongju,
			isShow: bookConfig.value.textbookComponents.indexOf('366F6CF3') > -1
			}
			]
			floatingToolBox = [
			{
			icon: huabi,
			name: '画笔',
			isShow: bookConfig.value.textbookComponents.indexOf('800109C0') > -1
			},
			{
			icon: baiban,
			name: '白板',
			isShow: bookConfig.value.textbookComponents.indexOf('029DB3E0') > -1
			},
			{
			icon: biaozhu,
			name: '标记',
			isShow: bookConfig.value.textbookComponents.indexOf('2E613A8F') > -1
			},
			{
			icon: biaoqianw,
			name: '书签',
			isShow: bookConfig.value.textbookComponents.indexOf('D2D30448') > -1
			},
			{
			icon: jieping,
			name: '截屏',
			isShow: bookConfig.value.textbookComponents.indexOf('86F0A1B8') > -1
			}
			]
			dialogToolList = [
			{ icon: gaoliang,name: '高亮',isShow: bookConfig.value.textbookComponents.indexOf('395B91FC') > -1 },
			{ icon: huaxian,name: '划线',isShow: bookConfig.value.textbookComponents.indexOf('229EC161') > -1 },
			{ icon: biji2,name: '笔记',isShow: bookConfig.value.textbookComponents.indexOf('BC9B0CBD') > -1 },
			{ icon: biaozhu2,name: '标注',isShow: bookConfig.value.textbookComponents.indexOf('A63EE24F') > -1 },
			{ icon: fuzhi,name: '复制',isShow: bookConfig.value.textbookComponents.indexOf('7D5594B3') > -1 },
			{ icon: AIyuedu,name: 'AI阅读',isShow: bookConfig.value.textbookComponents.indexOf('C05AA457') > -1 },
			{ icon: cidian2,name: '词典',isShow: bookConfig.value.textbookComponents.indexOf('83FB80FD') > -1 },
			{ icon: baidu,name: '百科',isShow: bookConfig.value.textbookComponents.indexOf('65F95274') > -1 }
			]
			}

			//获取目录
			const catalogueData = ref([])
			const getCatalogueData = () => {
			axios
			.get(resourceUrl + '/1/information.json?t=123')
			.get(bookConfig.value.resourceUrl + '/information.json')
			.then(function (response) {
			console.log(response.data);
			console.log(response.data, '目录')
			var json = response.data
			// 处理获取到的json数据
			catalogueData.value = json.data
			headerData.totlePage = json.data[json.data.length - 1].end
			})
			.catch(function (error) {
			console.log(error)
			@@ -1045,72 +1263,219 @@
			}
			const defaultProps = {
			children: 'children',
			label: 'label'
			label: 'label',
			page: 'page'
			}
			const filterNode = (value, data) => {
			if (!value) return true
			return data.label.indexOf(value) !== -1
			}

			const handleNodeClick = (data) => {
			document.getElementById(data.id).scrollIntoView()
			console.log(data)
			headerData.process = data.start
			if (window.qiankunState && window.qiankunState.gotoPage)
			window.qiankunState.gotoPage(data.chapter, data.start)
			}

			//获取资源
			//资源分类
			const classifySelectList = reactive([
			{
			title: '图片',
			count: 0,
			key: 'image'
			},
			{
			title: '音频',
			count: 0,
			key: 'audio'
			},
			{
			title: '视频',
			count: 0,
			key: 'video'
			},
			{
			title: '其他',
			count: 0,
			key: 'other'
			}
			])
			const activeClassify = ref('image')
			const classifySelectList = ref([])
			//资源类型
			const resourceType = ref('default') //默认/教师
			const activeClassify = ref('')
			const searchShow = ref(true)
			const resourceData = ref({})
			const defaultResourceList = ref([])
			const teacherResourceList = ref([])
			const resourceDataList = ref([])
			const resourceImgList = ref([])
			const resourceVideoList = ref([])
			const resourceAudioList = ref([])
			const resourceDocList = ref([])
			const resourVisble = ref(false)
			const resourType = ref('')
			const resourType = ref('') //资源类型图片/音频
			const testVideo = ref('') //视频链接
			const testWord = ref('') //word链接

			const getResourceData = () => {
			axios
			.get(resourceUrl + '/1/resource.json')
			.get(bookConfig.value.resourceUrl + '/resource.json?t=12')
			.then(function (response) {
			var json = response.data
			// 处理获取到的json数据
			if (json.length > 0) {
			defaultResourceList.value = []
			teacherResourceList.value = []
			// 获取数组中所有对象的age属性的数量
			json.forEach((item) => {
			if (item.fileType == '图片') {
			resourceImgList.value.push(item)
			} else if (item.fileType == '视频') {
			resourceVideoList.value.push(item)
			} else if (item.fileType == '音频') {
			resourceAudioList.value.push(item)
			if (resourceType.value == 'default') {
			if (item.isTeacherResource == '否') {
			defaultResourceList.value.push(item)
			}
			} else {
			resourceDocList.value.push(item)
			if (item.isTeacherResource == '是') {
			teacherResourceList.value.push(item)
			}
			}
			})
			if (defaultResourceList.value.length > 0) {
			let imgCount = 0
			let audioCount = 0
			let videoCount = 0
			let exercisesCount = 0
			let otherCount = 0
			resourceDataList.value = []
			defaultResourceList.value.forEach((resItem) => {
			if (resItem.resourceType == '图片') {
			if (activeClassify.value == 'image') {
			resourceDataList.value.push(resItem)
			}
			imgCount++
			} else if (resItem.resourceType == '音频') {
			if (activeClassify.value == 'audio') {
			resourceDataList.value.push(resItem)
			}
			resourceDataList.value.push(resItem)
			audioCount++
			} else if (resItem.resourceType == '视频') {
			if (activeClassify.value == 'video') {
			resourceDataList.value.push(resItem)
			}
			videoCount++
			} else if (resItem.resourceType == '习题') {
			if (activeClassify.value == 'exercises') {
			resourceDataList.value.push(resItem)
			}
			exercisesCount++
			} else {
			if (activeClassify.value == 'other') {
			resourceDataList.value.push(resItem)
			}
			otherCount++
			}
			})
			classifySelectList.value = []
			if (imgCount > 0) {
			classifySelectList.value.push({
			title: '图片',
			count: imgCount,
			key: 'image'
			})
			}
			if (audioCount > 0) {
			classifySelectList.value.push({
			title: '音频',
			count: audioCount,
			key: 'audio'
			})
			}
			if (videoCount > 0) {
			classifySelectList.value.push({
			title: '视频',
			count: videoCount,
			key: 'video'
			})
			}
			if (exercisesCount > 0) {
			classifySelectList.value.push({
			title: '习题',
			count: exercisesCount,
			key: 'exercises'
			})
			}
			if (otherCount > 0) {
			classifySelectList.value.push({
			title: '其他',
			count: otherCount,
			key: 'other'
			})
			}
			if (!activeClassify.value) {
			activeClassify.value = classifySelectList.value[0].key
			defaultResourceList.value.forEach((resItem1) => {
			if (resItem1.resourceType == classifySelectList.value[0].title) {
			resourceDataList.value.push(resItem1)
			}
			})
			}
			} else {
			let imgCount = 0
			let audioCount = 0
			let videoCount = 0
			let exercisesCount = 0
			let otherCount = 0
			resourceDataList.value = []
			teacherResourceList.value.forEach((resItem) => {
			if (resItem.resourceType == '图片') {
			if (activeClassify.value == 'image') {
			resourceDataList.value.push(resItem)
			}
			imgCount++
			} else if (resItem.resourceType == '音频') {
			if (activeClassify.value == 'audio') {
			resourceDataList.value.push(resItem)
			}
			resourceDataList.value.push(resItem)
			audioCount++
			} else if (resItem.resourceType == '视频') {
			if (activeClassify.value == 'video') {
			resourceDataList.value.push(resItem)
			}
			videoCount++
			} else if (resItem.resourceType == '习题') {
			if (activeClassify.value == 'exercises') {
			resourceDataList.value.push(resItem)
			}
			exercisesCount++
			} else {
			if (activeClassify.value == 'other') {
			resourceDataList.value.push(resItem)
			}
			otherCount++
			}
			})
			classifySelectList.value = []
			if (imgCount > 0) {
			classifySelectList.value.push({
			title: '图片',
			count: imgCount,
			key: 'image'
			})
			}
			if (audioCount > 0) {
			classifySelectList.value.push({
			title: '音频',
			count: audioCount,
			key: 'audio'
			})
			}
			if (videoCount > 0) {
			classifySelectList.value.push({
			title: '视频',
			count: videoCount,
			key: 'video'
			})
			}
			if (exercisesCount > 0) {
			classifySelectList.value.push({
			title: '习题',
			count: exercisesCount,
			key: 'exercises'
			})
			}
			if (otherCount > 0) {
			classifySelectList.value.push({
			title: '其他',
			count: otherCount,
			key: 'other'
			})
			}
			if (!activeClassify.value) {
			activeClassify.value = classifySelectList.value[0].key
			teacherResourceList.value.forEach((resItem1) => {
			if (resItem1.resourceType == classifySelectList.value[0].title) {
			resourceDataList.value.push(resItem1)
			}
			})
			}
			}
			}
			resourceDataList.value = resourceImgList.value
			classifySelectList[0].count = resourceImgList.value.length
			classifySelectList[1].count = resourceAudioList.value.length
			classifySelectList[2].count = resourceVideoList.value.length
			classifySelectList[3].count = resourceDocList.value.length
			})
			.catch(function (error) {
			console.log(error)
			@@ -1118,34 +1483,37 @@
			}

			const goResourceDetail = (data) => {
			resourType.value = data.fileType
			if (data.fileType == '视频') {
			console.log(data)
			resourType.value = data.resourceType
			if (data.resourceType == '视频') {
			resourVisble.value = true
			testVideo.value = requestCtx + '/file/api/ApiDownload?md5=' + data.md5
			} else if (data.fileType == 'PDF') {
			window.open(requestCtx + '/file/api/ApiDownload?md5=' + data.md5)
			// testWord.value = resourceUrl + '/resourceData/' + data.name
			if(data.md5){
			testVideo.value = bookConfig.value.requestCtx + '/file/api/ApiDownload?md5=' + data.md5
			}else{
			testVideo.value = bookConfig.value.resourceUrl + '/' + data.resourcePath
			}

			} else if (data.resourceType == 'word') {
			testWord.value = bookConfig.value.resourceUrl + '/' + data.resourcePath
			} else {
			if (window.qiankunState && window.qiankunState.gotoPage) {
			window.qiankunState.gotoPage(Number(data.chapterNum), Number(data.pagination))
			}
			}
			}

			//资源类型选择默认/教师
			const selectResourceType = (type) => {
			resourceType.value = type
			searchText.value = ''
			getResourceData()
			}
			//资源类型图片/视频/音频/习题/其他
			const classifyClick = (item) => {
			activeClassify.value = item.key
			resourceDataList.value = []
			searchText.value = ''
			switch (item.key) {
			case 'image':
			resourceDataList.value = resourceImgList.value
			break
			case 'audio':
			resourceDataList.value = resourceAudioList.value
			break
			case 'video':
			resourceDataList.value = resourceVideoList.value
			break
			case 'other':
			resourceDataList.value = resourceDocList.value
			break
			}
			getResourceData()
			}
			const searchBtn = () => {
			if (searchShow.value) {
			@@ -1154,54 +1522,30 @@
			searchShow.value = true
			}
			}
			// 菜单
			const menuData = reactive([
			{
			name: '目录',
			icon: mulu
			},
			{
			name: '笔记',
			icon: biji
			},
			{
			name: '资源',
			icon: ziyuan
			},
			{
			name: '知识图谱',
			icon: zhishitupu
			},
			{
			name: '截图',
			icon: jietu
			},
			{
			name: '标签',
			icon: biaoqian
			}
			])

			// 选中菜单
			const activeMenu = ref(0)
			//资源类型
			const resourceType = ref('default')
			const activeMenu = ref('目录')

			// 菜单点击
			const menuItemClick = (index) => {
			activeMenu.value = index
			const menuItemClick = (name) => {
			activeMenu.value = name
			searchText.value = ''
			menuState.open = true
			switch (index) {
			case '0':
			switch (name) {
			case '目录':
			break
			case '1':
			// getSignData()
			case '笔记':
			getNotesList()
			break
			case '2':
			case '资源':
			break
			case '3':
			case '知识图谱':
			break
			case '4':
			case '截图':
			getScreenshotList()
			break
			case '5':
			case '书签':
			getReMarkList()
			break
			}
			}
			@@ -1221,9 +1565,6 @@
			// }
			}

			const selectResourceType = (type) => {
			resourceType.value = type
			}
			const searchText = ref<string>('') //筛选
			const menuState = reactive({
			open: true,
			@@ -1234,19 +1575,19 @@
			fontSizeList: [
			{
			lable: '小',
			key: '14'
			key: 14
			},
			{
			lable: '中',
			key: '16'
			key: 16
			},

			{
			lable: '大',
			key: '18'
			key: 18
			}
			],
			fontSizeActive: '16',
			fontSizeActive: 16,
			acoustics: false,
			animation: false,
			bgColorList: [
			@@ -1269,9 +1610,23 @@
			],
			bgColorActive: '#FBF9F4'
			})

			watch(
			() => menuState.open,
			(val) => {
			if (menuState.open == false) {
			floatingToolData.elLeft = 90
			} else {
			floatingToolData.elLeft = 390
			}
			}
			)

			const fontSizeSelect = (item) => {
			settingForm.fontSizeActive = item.key
			document.getElementById('app').style.fontSize = item.key + 'px'
			window.qiankunActions.setGlobalState({
			fontSize: item.key
			})
			}
			const bgColorSelect = (item) => {
			settingForm.bgColorActive = item.key
			@@ -1283,79 +1638,43 @@
			} else {
			menuState.notesColor = 'all'
			}
			// getNotesList()
			getNotesList()
			}
			const catalogTree = ref()
			const searchBook = async () => {
			if (activeMenu.value == 1) {
			// getNotesList()
			getSignData()

			}
			if (activeMenu.value == 2) {
			let dataList = JSON.parse(JSON.stringify(resourceDataList.value))
			if (searchText.value) {
			resourceDataList.value = []
			searchText.value = searchText.value.replace(/^\s\|\s$/g, '')
			let text = searchText.value.replace(/^\s\|\s$/g, '')
			dataList.forEach((item) => {
			if (item.name.indexOf(text) > -1) {
			let replaceStr = "<span style='background:#F5E12A'>" + text + '</span>'
			let htmlStr = item.name.split(text).join(replaceStr)
			item.name = '<p>' + htmlStr + '</p>'
			resourceDataList.value.push(item)
			}
			})
			}
			switch (activeMenu.value) {
			case '目录':
			if (catalogTree) catalogTree.value.filter(searchText.value)
			break
			case '笔记':
			getNotesList()
			break
			case '资源':
			let dataList = JSON.parse(JSON.stringify(resourceDataList.value))
			if (searchText.value) {
			resourceDataList.value = []
			searchText.value = searchText.value.replace(/^\s\|\s$/g, '')
			let text = searchText.value.replace(/^\s\|\s$/g, '')
			dataList.forEach((item) => {
			if (item.resourceName.indexOf(text) > -1) {
			resourceDataList.value.push(item)
			}
			})
			} else {
			getResourceData()
			}
			break
			case '知识图谱':
			break
			case '截图':
			getScreenshotList()
			break
			case '书签':
			getReMarkList()
			break
			}
			}

			// 右侧工具
			const teachToolsMenuData = reactive([
			{
			name: 'AI智能问答',
			icon: aIzhinengwenda
			},
			{
			name: '词典',
			icon: cidian
			},
			{
			name: '生字卡片',
			icon: shengzikapian
			},
			{
			name: '互动问答',
			icon: hudongwenda
			},
			{
			name: '思维导图',
			icon: siweidaotu
			},
			{
			name: 'GGB函数工具',
			icon: GGB
			},
			{
			name: '几何工具',
			icon: jihe
			},
			{
			name: 'Python',
			icon: python
			},
			{
			name: 'C++',
			icon: cjiajia
			},
			{
			name: 'Javascript',
			icon: javascript
			},
			{
			name: '模型工具',
			icon: moxinggongju
			}
			])
			const baiduVisible = ref(false)
			const wendaVisible = ref(false)
			const cidianVisible = ref(false)
			@@ -1413,89 +1732,17 @@
			}

			//画布悬浮操作
			const floatingToolBox = reactive([
			{
			icon: huabi,
			activeIcon: huabi1,
			name: '画笔'
			},
			{
			activeIcon: baiban1,
			icon: baiban,
			name: '白板'
			},
			{
			activeIcon: biaozhu1,
			icon: biaozhu,
			name: '标注'
			},
			{
			activeIcon: biaoqian1,
			icon: biaoqianw,
			name: '标签'
			},
			{
			activeIcon: jieping1,
			icon: jieping,
			name: '截屏'
			}
			])

			let canvas = null
			const floatingToolData = reactive({
			activeToolData: '', //选中工具
			elLeft: 400,
			elTop: 300,
			elLeft: 390,
			startclientx: 0,
			startclienty: 0,
			fontSizeActive: '16',
			thicknessActive: '3', //画笔选中粗细
			lineTypeActive: 'solid', //画笔选中线类型
			lineColorActive: '#333' //画笔选中线颜色
			startclienty: 0
			})

			//画布
			const canvasShow = ref(false)

			const floatOverHander = (item) => {
			const curIndex = floatingToolBox.findIndex((f) => f.name == item.name)
			switch (curIndex) {
			case 0:
			floatingToolBox[0].icon = huabi1
			break
			case 1:
			floatingToolBox[1].icon = baiban1
			break
			case 2:
			floatingToolBox[2].icon = biaozhu1
			break
			case 3:
			floatingToolBox[3].icon = biaoqian1
			break
			case 4:
			floatingToolBox[4].icon = jieping1
			break
			}
			}
			const floatOutHander = (item) => {
			const curIndex = floatingToolBox.findIndex((f) => f.name == item.name)
			switch (curIndex) {
			case 0:
			floatingToolBox[0].icon = huabi
			break
			case 1:
			floatingToolBox[1].icon = baiban
			break
			case 2:
			floatingToolBox[2].icon = biaozhu
			break
			case 3:
			floatingToolBox[3].icon = biaoqianw
			break
			case 4:
			floatingToolBox[4].icon = jieping
			break
			}
			}

			//截图事件
			const nameRef = ref()
			@@ -1507,18 +1754,24 @@
			const urlData = ref('') //截图base64
			const screenshotList = ref([])
			const screenshotData = ref([])
			const imgPreviewList = ref([])
			const previewIndex = ref(0)
			const showDelete = ref(null)
			const isUpdateImg = ref(false)
			const screenshotId = ref(0)

			//浮窗工具栏点击事件
			const floatItemHandle = (item) => {
			floatingToolData.activeToolData = item.name
			switch (item.name) {
			canvasShow.value = false
			switch (floatingToolData.activeToolData) {
			case '画笔':
			canvasShow.value = true
			toolSelectData.activeTool = 'huabi'
			break
			case '标注':
			case '标记':
			break
			case '标签':
			case '书签':
			reMark()
			break
			case '截屏':
			@@ -1526,28 +1779,19 @@
			break
			}
			}
			const dragend = (e) => {
			let x = e.clientX - floatingToolData.startclientx
			let y = e.clientY - floatingToolData.startclienty
			if (floatingToolData.elLeft + x > 0 \|\| floatingToolData.elTop + y > 0) {
			floatingToolData.elLeft = e.x - 40
			floatingToolData.elTop = e.y - 60
			}
			}
			const dragstart = (e) => {
			floatingToolData.startclientx = e.clientX
			floatingToolData.startclienty = e.clientY
			}

			//画笔操作栏事件
			const toolSelectData = reactive({
			activeTool: '',
			fontSizeActive: '16',
			fontSizeActive: '16', // 文字操作文字大小
			thicknessActive: '3', //画笔选中粗细
			lineTypeActive: 'solid', //画笔选中线类型
			lineColorActive: '#333' //画笔选中线颜色
			lineColorActive: '#333', //画笔选中线颜色
			graphType: '' //图形类型，方形，圆形...
			})
			const toolSelectHandle = (title) => {
			toolSelectData.activeTool = title
			toolSelectData.lineColorActive = ''
			switch (title) {
			case 'huabi':
			init()
			@@ -1594,14 +1838,105 @@
			toolSelectData.fontSizeActive = str
			}

			//标注显示隐藏
			const labelShow = (str) => {}

			//标签
			const reMark =() => {


			//选择图形
			const graphSelect = (type) => {
			toolSelectData.graphType = type
			switch (type) {
			case 'square':
			break
			case 'rotundity':
			break
			case 'triangle':
			break
			case 'lineSegment':
			break
			}
			}
			//标记显示隐藏
			const labelShow = (str) => {
			console.log(str, '标记')
			if (str == 'hide') {
			if (window.qiankunState && window.qiankunState.delSign) {
			window.qiankunState.delSign({ ids: [] })
			}
			}
			}

			//书签
			const currentChapter = ref(0)
			const reMarkList = ref([])
			const reMarkData = ref([])
			const reMarkId = ref([])

			const reMark = () => {
			let chapterData = catalogueData.value.find((item) => item.chapter == Number(currentChapter.value))
			console.log(chapterData)
			reMarkData.value.push({
			id: toolClass.uuid(8),
			createDate: new Date(),
			page: headerData.process,
			chapterNum: currentChapter.value,
			chapterName: chapterData.label
			})
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'reMark',
			key: bookConfig.value.bookId,
			value: JSON.stringify(reMarkData.value)
			}
			]
			})
			.then((res) => {
			floatingToolData.activeToolData = ''
			getReMarkList()
			})
			.catch(function (error) {})
			}
			const getReMarkList = () => {
			reMarkList.value = []
			reMarkData.value = []
			MG.identity.getUserKey({
			domain: 'reMark',
			keys: [bookConfig.value.bookId]
			}).then((res) => {
			if (res && res.length > 0 && res[0].value) {
			reMarkData.value = JSON.parse(res[0].value)
			let list = JSON.parse(res[0].value)
			list.forEach((item) => {
			let text = searchText.value.replace(/^\s\|\s$/g, '')
			if (searchText.value) {
			if (item.name.indexOf(text) > -1) {
			reMarkList.value.push(item)
			}
			} else {
			reMarkList.value.push(item)
			}
			})
			console.log(reMarkList.value, '124')
			}
			})
			}
			//删除书签
			const deleteReMark = (item) => {
			let list = reMarkList.value.filter((itemData) => itemData.id !== item.id)
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'reMark',
			key: bookConfig.value.bookId,
			value: JSON.stringify(list)
			}
			]
			}).then((res) => {
			ElMessage({
			message: '删除书签成功!',
			type: 'success'
			})
			getReMarkList()
			})
			}

			//截图
			//截图事件
			function jitT() {
			@@ -1615,6 +1950,7 @@
			//确认回调
			const callback = (val: any) => {
			screenshotVisble.value = true
			nameData.value = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
			urlData.value = val.base64
			}
			//取消回调
			@@ -1625,34 +1961,45 @@
			//保存截图
			const addScreenshot = () => {
			if (nameData.value) {
			screenshotData.value.push({
			createDate: new Date(),
			imgUrl: urlData.value,
			name: nameData.value
			})
			if (isUpdateImg.value) {
			screenshotData.value = []
			screenshotList.value.forEach((itemNote) => {
			if ((itemNote.id = screenshotId.value)) {
			itemNote.name = nameData.value
			}
			})
			screenshotData.value = screenshotList.value
			} else {
			screenshotData.value.push({
			id: toolClass.uuid(8),
			createDate: new Date(),
			imgUrl: urlData.value,
			name: nameData.value
			})
			}

			screenshotLoading.value = true
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'screenshot',
			key: bookId.value,
			key: bookConfig.value.bookId,
			value: JSON.stringify(screenshotData.value)
			}
			]
			}
			}).then((res) => {
			screenshotLoading.value = false
			getScreenshotList()
			nameData.value = ''
			urlData.value = ''
			floatingToolData.activeToolData = ''
			screenshotVisble.value = false
			}).catch(function (error) {
			screenshotLoading.value = false
			})
			})
			.then((res) => {
			screenshotLoading.value = false
			getScreenshotList()
			nameData.value = ''
			urlData.value = ''
			floatingToolData.activeToolData = ''
			screenshotVisble.value = false
			isUpdateImg.value = false
			})
			.catch(function (error) {
			screenshotLoading.value = false
			})
			} else {
			ElMessage.error('截图名称不能为空!')
			}
			@@ -1662,51 +2009,78 @@
			}

			const getScreenshotList = () => {
			request({
			url: '/identity/api/ApiGetAppUserKey',
			method: 'post',
			data: {
			screenshotData.value = []
			screenshotList.value = []
			MG.identity.getUserKey({
			domain: 'screenshot',
			keys: [bookId.value]
			}
			}).then((res) => {
			keys: [bookConfig.value.bookId]
			}).then((res) => {
			if (res && res.length > 0 && res[0].value) {
			screenshotList.value = JSON.parse(res[0].value)
			screenshotData.value = JSON.parse(res[0].value)
			let list = JSON.parse(res[0].value)
			list.forEach((item) => {
			let text = searchText.value.replace(/^\s\|\s$/g, '')
			if (searchText.value) {
			if (item.name.indexOf(text) > -1) {
			screenshotList.value.push(item)
			imgPreviewList.value.push(item.imgUrl)
			}
			} else {
			screenshotList.value.push(item)
			imgPreviewList.value.push(item.imgUrl)
			}
			})
			}
			})
			}
			//查看截图
			const getCapture = (item) => {
			const getCapture = (item, index) => {
			imgUrl.value = item.imgUrl
			previewIndex.value = index
			confirmDialog.value = true
			}
			const closePreview = () => {
			imgPreviewList.value = []
			confirmDialog.value = false
			}
			// 编辑截图名称
			const updateScreenshot = (item) => {
			nameData.value = item.name
			screenshotId.value = item.id
			isUpdateImg.value = true
			screenshotVisble.value = true
			}

			//删除截图
			const deleteScreenshot = (item) => {
			let list = screenshotList.value.filter((itemData) => itemData.imgUrl !== item.imgUrl)
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			setKeyRequests: [
			{
			domain: 'screenshot',
			key: bookId.value,
			value: JSON.stringify(list)
			}
			]
			}
			}).then((res) => {
			ElMessage({
			message: '删除截图成功!',
			type: 'success'
			})
			getScreenshotList()
			let list = screenshotList.value.filter((itemData) => itemData.id !== item.id)
			ElMessageBox.confirm('确定要删除此截图吗？', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			autofocus: false,
			type: 'warning'
			})
			.then(() => {
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'screenshot',
			key: bookConfig.value.bookId,
			value: JSON.stringify(list)
			}
			]
			}).then((res) => {
			ElMessage({
			message: '删除截图成功!',
			type: 'success'
			})
			getScreenshotList()
			})
			})
			.catch(() => {})
			}

			//选中文字工具栏
			const selectText = ref('') //选中文字
			const showToolBox = ref(false)
			const dialogToolData = reactive({
			left: 500,
			@@ -1722,6 +2096,7 @@
			///内容选中
			const getSelection = (data) => {
			if (data.txt) {
			toolActive.value = ''
			dialogToolData.txt = data.txt
			dialogToolData.page = data.page
			dialogToolData.chapter = data.chapterNum
			@@ -1734,18 +2109,7 @@
			const toolActive = ref('')
			const colorActive = ref('')
			const noteColorActive = ref('')
			const dialogToolList = reactive([
			{ icon: gaoliang, activeIcon: gaoliang1, name: '高亮' },
			{ icon: huaxian, activeIcon: huaxian1, name: '划线' },
			{ icon: biji2, activeIcon: biji1, name: '笔记' },
			{ icon: biaozhu2, activeIcon: biaozhu3, name: '标注' },
			{ icon: fuzhi, activeIcon: fuzhi1, name: '复制' },
			{ icon: AIyuedu, activeIcon: AIyuedu1, name: 'AI阅读' },
			{ icon: cidian2, activeIcon: cidian1, name: '词典' },
			{ icon: baidu, activeIcon: cidian1, name: '百科' }
			// { icon: yuyinyuedu, activeIcon: yuyinyuedu1, name: '语音阅读' }
			// { icon: cidian2, activeIcon: cidian1, name: '翻译' }
			])

			const colorSelectList = reactive([
			{
			label: '黄色',
			@@ -1771,7 +2135,9 @@

			//笔记弹窗
			const addNoteVisble = ref(false)
			const isUpdate = ref(false)
			const formData = reactive({
			id: '',
			desc: ''
			})
			//笔记弹窗关闭
			@@ -1857,9 +2223,10 @@
			colorActive.value = ''
			switch (item.name) {
			case 'AI阅读':
			const utterance = new SpeechSynthesisUtterance(selectText.value)
			const utterance = new SpeechSynthesisUtterance(dialogToolData.txt)
			utterance.lang = 'zh-CN' // 设置语言为中文
			synth.speak(utterance)
			showToolBox.value = false
			break
			case '划线':
			break
			@@ -1867,6 +2234,7 @@
			break
			case '笔记':
			formData.desc = ''
			noteColorActive.value = '#F5E12A'
			addNoteVisble.value = true
			showToolBox.value = false
			break
			@@ -1875,7 +2243,7 @@
			case '复制':
			try {
			//复制
			await toClipboard(selectText.value)
			await toClipboard(dialogToolData.txt)
			//下面可以设置复制成功的提示框等操作
			ElMessage({
			message: '复制成功',
			@@ -1889,8 +2257,10 @@
			break
			case '词典':
			cidianVisible.value = true
			console.log(dialogToolData.txt)
			break
			case '百科':
			console.log('https://baike.baidu.com/item/' + dialogToolData.txt)
			baiduVisible.value = true
			break
			}
			@@ -1910,23 +2280,27 @@
			let data = null
			switch (toolActive.value) {
			case '高亮':
			dom = 'highLightData-' + bookId.value
			dom = 'highLightData-' + bookConfig.value.bookId
			data = dialogToolData.lineHeight[dialogToolData.chapter]
			if (!data) data = []
			data.push({
			id: toolClass.uuid(8),
			txt: dialogToolData.txt,
			page: dialogToolData.page,
			chapterNum: dialogToolData.chapter,
			type: 'Highlight',
			color: colorActive.value
			})
			break
			case '划线':
			dom = 'underline-' + bookId.value
			dom = 'underline-' + bookConfig.value.bookId
			data = dialogToolData.scribeList[dialogToolData.chapter]
			if (!data) data = []
			data.push({
			id: toolClass.uuid(8),
			txt: dialogToolData.txt,
			page: dialogToolData.page,
			chapterNum: dialogToolData.chapter,
			type: 'Dashing',
			color: colorActive.value
			})
			@@ -1934,30 +2308,29 @@
			case '笔记':
			if (!formData.desc.replace(/^\s\|\s$/g, '')) {
			ElMessage.error('笔记内容不能为空!')
			return
			return
			}
			if (!noteColorActive.value) {
			ElMessage.error('请选择笔记颜色!')
			return
			}
			dom = 'notes-' + bookId.value
			data = dialogToolData.notesList.length != 0 ? dialogToolData.notesList[dialogToolData.chapter] : []
			dom = 'notes-' + bookConfig.value.bookId
			data = dialogToolData.notesList[dialogToolData.chapter]
			if (!data) data = []
			data.push({
			id: toolClass.uuid(8),
			txt: dialogToolData.txt,
			page: dialogToolData.page,
			chapterNum: dialogToolData.chapter,
			type: 'Note',
			color: noteColorActive.value,
			createDate: new Date(),
			note: formData.desc.replace(/^\s\|\s$/g, '')
			})


			break
			}
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: dom,
			@@ -1965,28 +2338,22 @@
			value: JSON.stringify(data)
			}
			]
			}
			}).then((res) => {
			}).then((res) => {
			showToolBox.value = false
			addNoteVisble.value = false
			colorActive.value = ''
			noteColorActive.value = ''
			toolActive.value = ''
			getSignData()
			getNotesList()
			})
			}



			const getSignData = () => {
			request({
			url: '/identity/api/ApiGetAppUserKey',
			method: 'post',
			data: {
			domain: 'highLightData-' + bookId.value,
			MG.identity.getUserKey({
			domain: 'highLightData-' + bookConfig.value.bookId,
			keys: activeCatalog.value.map((item) => item + '')
			}
			}).then((res) => {
			}).then((res) => {
			if (res && res.length > 0) {
			for (let i = 0; i < res.length; i++) {
			const item = res[i]
			@@ -2002,20 +2369,17 @@
			}
			}
			})
			request({
			url: '/identity/api/ApiGetAppUserKey',
			method: 'post',
			data: {
			domain: 'underline-' + bookId.value,
			MG.identity.getUserKey({
			domain: 'underline-' + bookConfig.value.bookId,
			keys: activeCatalog.value.map((item) => item + '')
			}
			}).then((res) => {
			}).then((res) => {
			if (res && res.length > 0) {
			for (let i = 0; i < res.length; i++) {
			const item = res[i]
			const data = JSON.parse(item.value)
			// 储值
			dialogToolData.scribeList[item.key] = data

			// 渲染
			for (let j = 0; j < data.length; j++) {
			const citem = data[j]
			@@ -2025,22 +2389,16 @@
			}
			}
			})
			request({
			url: '/identity/api/ApiGetAppUserKey',
			method: 'post',
			data: {
			domain: 'notes-' + bookId.value,
			MG.identity.getUserKey({
			domain: 'notes-' + bookConfig.value.bookId,
			keys: activeCatalog.value.map((item) => item + '')
			}
			}).then((res) => {
			}).then((res) => {
			if (res && res.length > 0) {
			for (let i = 0; i < res.length; i++) {
			const item = res[i]
			const data = JSON.parse(item.value)
			// 储值
			scribeData.noteList = data
			dialogToolData.notesList[item.key] = data
			console.log(dialogToolData.notesList,"notesList")
			// 渲染
			for (let j = 0; j < data.length; j++) {
			const citem = data[j]
			@@ -2048,6 +2406,57 @@
			window.qiankunState.renderSign(citem.type, citem)
			}
			}
			}
			})
			}

			//菜单笔记列表
			const getNotesList = () => {
			let chapterList = []
			catalogueData.value.forEach((item) => {
			chapterList.push(item.chapter + '')
			})
			scribeData.noteList = []
			MG.identity.getUserKey({
			domain: 'notes-' + bookConfig.value.bookId,
			keys: chapterList
			}).then((res) => {
			if (res && res.length > 0) {
			for (let i = 0; i < res.length; i++) {
			const item = res[i]
			// 储值
			let data = catalogueData.value.find((item1) => item1.chapter == Number(item.key))
			let list = JSON.parse(item.value)
			let itemList = []
			if (list.length > 0) {
			list.forEach((item) => {
			if (searchText.value) {
			let text = searchText.value.replace(/^\s\|\s$/g, '')
			if (item.note.indexOf(text) > -1 \|\| item.txt.indexOf(text) > -1) {
			if (menuState.notesColor == 'all') {
			itemList = list
			} else if (item.color == menuState.notesColor) {
			itemList.push(item)
			}
			}
			} else {
			if (menuState.notesColor == 'all') {
			itemList = list
			} else if (item.color == menuState.notesColor) {
			itemList.push(item)
			}
			}
			})
			}
			if (data.chapter == Number(item.key) && itemList.length > 0) {
			scribeData.noteList.push({
			chapter: data.chapter,
			chapterName: data.label,
			noteList: itemList
			})
			}
			}
			console.log(scribeData.noteList, 'scribeData.noteList')
			}
			})
			}
			@@ -2062,32 +2471,26 @@
			})

			// 划线、笔记、高亮点击回调
			window.signClick = (type, id)=>{
			console.log("signClick点击事件回调的实例", type, id);
			// if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[id]})
			if(type == 'Note'){
			let data = dialogToolData.notesList.filter((item) => id.indexOf(item.id) == -1)
			console.log(data)
			formData.desc = notes.note
			noteColorActive.value = notes.color
			window.signClick = (type, id, chapterNum) => {
			console.log('signClick点击事件回调的实例', type, id, chapterNum)
			dialogToolData.chapter = chapterNum
			if (type == 'Note') {
			let list = dialogToolData.notesList[chapterNum]
			let data = list.find((item) => item.id == id)
			console.log(data, 123)
			formData.id = id
			formData.desc = data.note
			noteColorActive.value = data.color
			addNoteVisble.value = true
			}else{
			isUpdate.value = true
			} else {
			lineDelete.showLineDelete = true
			lineDelete.deleteType = type
			lineDelete.id = id
			dialogToolData.chapter = chapterNum
			}
			}

			window.notesVisbleShow = function (txt) {
			addNoteVisble.value = true
			let notes = dialogToolData.notesList.find((item) => item.id == id)
			formData.desc = notes.note
			colorActive.value = notes.color
			selectNode.value = notes.selectNode
			selectText.value = notes.selectText
			selectPage.value = notes.selectPage
			dialogToolData.chapter = notes.chapter
			}
			const delUserKey = () => {
			let type = lineDelete.deleteType
			let ids = lineDelete.id
			@@ -2095,22 +2498,16 @@
			let data = null
			switch (type) {
			case 'Highlight':
			dom = 'highLightData-' + bookId.value
			dom = 'highLightData-' + bookConfig.value.bookId
			data = dialogToolData.lineHeight
			break
			case 'Dashing':
			dom = 'underline-' + bookId.value
			dom = 'underline-' + bookConfig.value.bookId
			data = dialogToolData.scribeList
			break
			}
			data = data.filter((item) => ids.indexOf(item.id) == -1)
			console.log(data[0])
			let list = data[0].filter((item) => item.id != ids)
			console.log(list)
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			let list = data[dialogToolData.chapter].filter((item) => item.id != ids)
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: dom,
			@@ -2118,119 +2515,89 @@
			value: JSON.stringify(list)
			}
			]
			}
			}).then((res) => {
			if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[ids]})
			}).then((res) => {
			lineDelete.showLineDelete = false
			if (window.qiankunState && window.qiankunState.delSign)
			window.qiankunState.delSign({ ids: [ids] })
			getSignData()
			})
			}


			const lineDeleteBtn = () => {
			if (lineDelete.deleteType == 'underline') {
			let list = scribeData.scribeDataList.filter((item) => item.selectText != lineDelete.deleteTxt)
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			setKeyRequests: [
			{
			domain: 'underline',
			key: bookId.value,
			value: JSON.stringify(list)
			}
			]
			}
			}).then((res) => {
			lineDelete.showLineDelete = false
			let list = document.querySelectorAll('.underline')
			list.forEach((itemNode) => {
			if (itemNode.innerText == lineDelete.deleteTxt) {
			itemNode.removeAttribute('style')
			itemNode.className = ''
			itemNode.removeAttribute('onclick')
			}
			})
			getScribeList()
			})
			} else if (lineDelete.deleteType == 'highLight') {
			let list = scribeData.lineHeightList.filter((item) => item.selectText != lineDelete.deleteTxt)
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			setKeyRequests: [
			{
			domain: 'highLight',
			key: bookId.value,
			value: JSON.stringify(list)
			}
			]
			}
			}).then((res) => {
			lineDelete.showLineDelete = false
			let list = document.querySelectorAll('.highLight')
			list.forEach((itemNode) => {
			if (itemNode.innerText == lineDelete.deleteTxt) {
			itemNode.removeAttribute('style')
			itemNode.className = ''
			itemNode.removeAttribute('onclick')
			}
			})
			getlineHeightList()
			})
			}
			}

			//笔记跳转
			const jumpContent = (item) => {
			console.log(item)
			if (window.qiankunState && window.qiankunState.gotoPage) window.qiankunState.gotoPage(5, 100)
			}

			//笔记编辑
			const update = (item, type) => {
			dialogToolData.notesList.splice(
			dialogToolData.notesList.findIndex((itemData) => itemData.selectText == item.selectText),
			1
			)
			dialogToolData.txt = item.txt
			dialogToolData.page = item.page
			dialogToolData.chapter = item.chapterNum
			noteColorActive.value = item.color
			dialogToolData.chapter = item.chapter
			formData.desc = item.note
			addNoteVisble.value = true
			}

			//删除
			const deleteBtn = (item) => {
			if (type == 'note') {
			// 移除
			let list = dialogToolData.noteList.filter((itemData) => itemData.id !== item.id)
			request({
			url: '/identity/api/ApiAppUserSetKey',
			method: 'post',
			data: {
			setKeyRequests: [
			{
			domain: 'notes',
			key: bookId.value,
			value: JSON.stringify(list)
			}
			]
			}
			}).then((res) => {
			ElMessage({
			message: '删除笔记成功!',
			type: 'success'
			})
			if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[id]})
			getNotesList()
			})
			if (window.qiankunState && window.qiankunState.gotoPage) {
			window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page))
			}
			}

			//菜单笔记编辑
			const update = (item) => {
			console.log(item)
			dialogToolData.chapter = item.chapterNum
			noteColorActive.value = item.color
			formData.id = item.id
			formData.desc = item.note
			addNoteVisble.value = true
			isUpdate.value = true
			}
			const updateUserKey = () => {
			let data = scribeData.noteList.find((item1) => item1.chapter == dialogToolData.chapter)
			data.noteList.forEach((itemNote) => {
			if ((itemNote.id = formData.id)) {
			itemNote.note = formData.desc
			itemNote.color = noteColorActive.value
			}
			})
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'notes-' + bookConfig.value.bookId,
			key: dialogToolData.chapter,
			value: JSON.stringify(data.noteList)
			}
			]
			}).then((res) => {
			addNoteVisble.value = false
			isUpdate.value = false
			getNotesList()
			getSignData()
			})
			}

			//菜单删除笔记
			const deleteBtn = (item) => {
			let data = scribeData.noteList.find((item1) => item1.chapter == Number(item.chapterNum))
			// 移除
			let list = data.noteList.filter((itemData) => itemData.id !== item.id)
			ElMessageBox.confirm('确定要删除此笔记吗？', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			autofocus: false,
			type: 'warning'
			})
			.then(() => {
			MG.identity.setUserKey({
			setKeyRequests: [
			{
			domain: 'notes-' + bookConfig.value.bookId,
			key: item.chapterNum,
			value: JSON.stringify(list)
			}
			]
			}).then((res) => {
			ElMessage({
			message: '删除笔记成功!',
			type: 'success'
			})
			getNotesList()
			if (window.qiankunState && window.qiankunState.delSign) {
			window.qiankunState.delSign({ ids: [item.id] })
			}
			})
			})
			.catch(() => {})
			}

			//内容区域顶部显示

			@@ -2240,6 +2607,7 @@
			minutes: 0,
			hours: 0,
			process: 0,
			totlePage: 0,
			pageSize: 100
			})
			//上课时长计时器
			@@ -2271,16 +2639,21 @@
			}

			const changePageSize = (str) => {
			if (str == 'add') {
			headerData.pageSize = Number(headerData.pageSize) + 5
			} else {
			headerData.pageSize = Number(headerData.pageSize) - 5
			if (str == 'add' && headerData.pageSize < 150) {
			headerData.pageSize = Number(headerData.pageSize) + 10
			window.qiankunActions.setGlobalState({
			scale: headerData.pageSize
			})
			} else if (str == 'reduce' && headerData.pageSize > 50) {
			headerData.pageSize = Number(headerData.pageSize) - 10
			window.qiankunActions.setGlobalState({
			scale: headerData.pageSize
			})
			}
			}

			const layoutBtn = () => {
			localStorage.clear()
			console.log(888)
			router.push('/login')
			}
			</script>
			@@ -2312,6 +2685,13 @@
			.userInfoBox {
			display: flex;
			align-items: center;
			.userName{
			font-size: 18px;
			margin-right:15px;
			padding-right:15px;
			border-right:1px solid #e0e0e0;
			color: #2C2C2C;
			}
			.layout {
			width: 69px;
			height: 30px;
			@@ -2327,6 +2707,7 @@
			overflow: hidden;
			flex: 1;
			display: flex;
			position: relative;
			.menuBox {
			width: 80px;
			flex-shrink: 0;
			@@ -2388,9 +2769,10 @@
			display: flex;
			justify-content: center;
			align-items: center;
			border-bottom: 1px solid #efefef;
			}
			.resourceBox {
			padding: 15px 0;
			padding: 10px 0;
			margin: 0 20px;
			border-bottom: 1px solid rgba(204, 204, 204, 0.32);
			.classification {
			@@ -2407,10 +2789,13 @@
			}
			.count {
			width: 35px;
			margin: 5px auto;
			margin: 0 auto;
			margin-top: 5px;
			border-radius: 10px;
			background: #fff;
			color: #c8c8c8;
			height: 18px;
			font-size: 12px;
			}
			.activeClassify,
			.classifyItem:hover {
			@@ -2437,6 +2822,7 @@
			}
			.inputBox {
			margin-top: 10px;
			width: 100% !important;
			}
			}
			.resourceTab {
			@@ -2470,11 +2856,13 @@
			}
			}
			.inputBox {
			width: 85%;
			.custom-input {
			border: 1px solid #0093ff !important;
			border-radius: 50px;
			overflow: hidden;
			background: #fff;
			height: 34px;
			}
			.is-focus,
			.el-input__wrapper {
			@@ -2567,14 +2955,7 @@

			.rName {
			margin-top: 10px;
			height: 20px;
			line-height: 20px;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 1;
			overflow: hidden;
			text-overflow: ellipsis;
			color: #000;
			}
			}
			}
			@@ -2595,13 +2976,23 @@
			}
			.deleteBox {
			position: absolute;
			top: 2px;
			right: 2px;
			width: 20px;
			height: 20px;
			background: rgba(44, 44, 44, 0.3);
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(44, 44, 44, 0.6);
			text-align: center;
			padding: 2px;
			.delImg {
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			.icon {
			position: static;
			margin: 5px;
			}
			}
			}
			// .capture {
			// width: 100%;
			@@ -2609,9 +3000,8 @@
			.captureName {
			height: 20px;
			line-height: 20px;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 1;
			width: 120px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			color: #000;
			@@ -2680,20 +3070,40 @@
			}
			}
			}
			.chapterName {
			margin: 15px;
			}
			.reMarkItem {
			margin: 15px;
			background: #fff;
			border-radius: 10px;
			padding: 10px;
			display: flex;
			.reMarkCon {
			width: 240px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			margin-right: 8px;
			}
			.deleteReMarkImg {
			display: flex;
			align-items: center;
			}
			}
			}
			}
			.menuStateBox {
			width: 25px;
			height: 25px;
			background: #fff;
			border-radius: 3px 0px 0px 3px;
			border: 1px solid #bce3ff;
			position: fixed;
			position: absolute;
			line-height: 22px;
			top: 50%;
			left: 370px;
			left: 380px;
			text-align: center;
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.16);
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3);
			z-index: 2;
			img {
			height: 10px;
			width: 18px;
			@@ -2703,11 +3113,13 @@
			.pageBox {
			flex: 1;
			font-size: 16px;
			position: relative;
			.pageBox-header {
			height: 57px;
			padding: 0 20px;
			background: #fff;
			display: flex;
			z-index: 99;
			align-items: center;
			justify-content: space-between;
			.classTime {
			@@ -2728,8 +3140,9 @@
			.progress {
			text-align: center;
			.bookName {
			font-weight: bold;
			margin-bottom: 3px;
			font-weight: 800;
			margin-bottom: 5px;
			color: #333;
			}
			}
			.rightBox {
			@@ -2738,14 +3151,19 @@
			display: flex;
			align-items: center;
			padding: 0 20px;
			border-right: 1px solid #d8d8d8;

			div {
			padding: 5px;
			img {
			width: 18px;
			height: 18px;
			}
			}
			}
			.brushImgBox {
			display: flex;
			align-items: center;
			border-left: 1px solid #d8d8d8;
			div {
			padding: 5px;
			display: flex;
			@@ -2762,6 +3180,7 @@
			.pageBox-content {
			height: calc(100% - 57px);
			background: #fbf9f4;
			padding: 10px 0;
			.content-box {
			height: 100%;
			position: relative;
			@@ -2804,7 +3223,7 @@
			}
			.menu {
			padding-top: 20px;
			li {
			li > div {
			// height: 50px;
			padding: 10px 36px;
			font-size: 16px;
			@@ -2818,6 +3237,7 @@
			}

			span {
			width:80px;
			margin-left: 10px;
			}
			}
			@@ -2827,20 +3247,21 @@
			height: 25px;
			background: #fff;
			border-radius: 3px 0px 0px 3px;
			border: 1px solid #bce3ff;
			position: absolute;
			line-height: 22px;
			top: 50%;
			right: 50px;
			text-align: center;
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.16);
			right: 67px;
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3);
			display: flex;
			align-items: center;
			justify-content: center;

			img {
			height: 10px;
			width: 18px;
			}
			}
			.right {
			right: 184px !important;
			right: 198px !important;
			border-radius: 0px 3px 3px 0px !important;
			}
			.classRoomBox {
			@@ -2904,67 +3325,75 @@
			}

			.draggableBox {
			width: 85px;
			background-image: linear-gradient(to bottom, #0093ff, #005dff);
			position: fixed;
			height: 310px;
			top: 300px;
			left: 450px;
			z-index: 99;
			width: 40px;
			background-image: linear-gradient(to bottom, #65bbf9, #1299fb);
			// background-color: rgba(44, 44, 44, 0.5);
			position: absolute;
			// height: 310px;
			top: 70px;
			left: 380px;
			z-index: 2000;
			border-radius: 10px;
			padding: 5px;
			padding: 6px;
			overflow: hidden;
			.floatToolItem {
			height: 60px;
			margin: 10px 0;
			height: 28px;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 5px;
			color: #fff;
			img {
			margin-right: 8px;
			}
			cursor: pointer;
			.text {
			margin-right: 5px;
			}
			}
			.floatToolItem:hover,
			.floatToolActive {
			background-color: #fff;
			color: #0093ff;
			background-color: rgba(255, 255, 255, 0.3);
			}
			}

			.brushBox {
			position: fixed;
			left: 500px;
			bottom: 20px;
			position: absolute;
			width:290px;
			bottom: 40px;
			left: 0;
			right: 0;
			z-index: 99;
			margin:auto;
			border-radius: 5px;
			background: #fff;
			// padding: 10px;
			overflow: hidden;
			border: 1px solid #0093ff;
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3);
			.toolList {
			display: flex;
			justify-content: center;
			align-items: center;
			.floatToolItem {
			margin: 10px;
			width: 48px;
			margin: 6px 8px;
			padding: 5px;
			width: 30px;
			border-radius: 5px;
			text-align: center;
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: center;
			// flex: 1;
			font-size: 14px;
			.imgBox {
			height: 22px;
			width: 22px;
			height: 18px;
			width: 18px;
			text-align: center;
			margin: 0 auto;
			margin-bottom: 5px;
			}
			}
			.floatToolItem:hover {
			background-color: rgba(44, 44, 44, 0.2);
			}
			.layOutTool {
			padding-left: 15px;
			height:20px;
			margin-right:5px;
			border-left: 1px solid #e0e0e0;
			}
			}
			@@ -2974,38 +3403,34 @@
			position: fixed;
			z-index: 2;
			.toolSelectBox {
			height: 57px;
			height: 40px;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 12px;
			overflow: hidden;
			padding: 5px;
			background-image: linear-gradient(to right, #0093ff, #005dff);
			background-color: rgba(90,90,90,0.9);
			// background-image: linear-gradient(to right, #0093ff, #005dff);
			.dialogToolItem {
			user-select: none;
			width: 60px;
			width: 26px;
			font-size: 12px;
			border-radius: 5px;
			padding: 5px 0;
			padding:3px;
			margin:0 5px;
			cursor: pointer;
			text-align: center;
			img {
			margin: 0 auto;
			display: block;
			margin-bottom: 5px;
			height: 16px;
			}
			span {
			color: #fff;
			}
			}
			.dialogToolItem:hover,
			.active {
			background-color: #fff;
			span {
			color: #0093ff;
			}
			background-color: rgba(255, 255, 255, 0.2);
			// span {
			// color: #0093ff;
			// }
			}
			}
			}
			@@ -3036,10 +3461,20 @@
			.lineDeleteBox {
			position: fixed;
			z-index: 2;
			border: 1px solid #0093ff;
			padding: 20px 8px;
			box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3);
			padding: 5px 20px;
			background: #fff;
			border-radius: 5px;
			.dialogToolItem{
			padding:3px;
			border-radius: 5px;
			display: flex;
			justify-content: center;
			align-items: center;
			}
			.dialogToolItem:hover{
			background-color: rgba(44, 44, 44, 0.2);
			}
			}
			.wendabox {
			width: 100%;
			@@ -3052,7 +3487,8 @@

			.myDialogs,
			.myNoteDialogs,
			.resourDialog {
			.resourDialog,
			.baiduDialog {
			padding: 0 !important;
			border-radius: 10px !important;
			overflow: hidden;
			@@ -3090,6 +3526,10 @@
			.screenshotDialog {
			width: 400px !important;
			}
			.baiduDialog {
			width: 90vw;
			height: 90vh;
			}
			.noteColorSelectBox {
			margin-top: 10px;
			width: 190px;