From cc26637f18b8ed178420122d7335b3f89be92ada Mon Sep 17 00:00:00 2001
From: litian <2804272236@qq.com>
Date: 星期四, 23 五月 2024 10:34:44 +0800
Subject: [PATCH] shujia

---
 src/views/home.vue | 1788 ++++++++++++++++++++++++++++++++++------------------------
 1 files changed, 1,039 insertions(+), 749 deletions(-)

diff --git a/src/views/home.vue b/src/views/home.vue
index e8b9eb8..f8ffa9e 100644
--- a/src/views/home.vue
+++ b/src/views/home.vue
@@ -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 == item.name ? 'active' : '']"
-          v-for="(item, index) in menuData"
-          :key="index"
-          @click="menuItemClick(item.name)"
-        >
-          <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">
@@ -99,7 +97,10 @@
               @keyup.enter="searchBook"
             >
               <template #prefix>
-                <el-icon class="hover"><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>
@@ -119,8 +120,8 @@
         <div class="menuList" v-if="activeMenu == '鐩綍'">
           <el-tree
             ref="catalogTree"
-            style="max-width: 600px"
             default-expand-all="true"
+            :expand-on-click-node="false"
             :data="catalogueData"
             :props="defaultProps"
             v-if="catalogueData.length > 0"
@@ -129,12 +130,12 @@
           >
             <template #default="{ node, data }">
               <div class="custom-tree-node">
-                <div class="catalogueLabel">{{ node.label }}</div>
+                <div class="catalogueLabel" :title="node.label">{{ node.label }}</div>
                 <span class="pageNum">{{ data.page }}</span>
               </div>
             </template>
           </el-tree>
-          <div v-if="catalogueData.length == 0">
+          <div v-else>
             <el-empty :image-size="60" description="鏆傛棤鏁版嵁" />
           </div>
         </div>
@@ -172,8 +173,8 @@
                         <span>{{ moment(item.createDate).format('YYYY-MM-DD') }}</span>
                       </div>
                       <div>
-                        <img :src="bianji" @click="update(item)" />
-                        <img :src="shanchu" @click="deleteBtn(item)" />
+                        <img :src="bianji" @click="update(item)" class="hover" />
+                        <img :src="shanchu" @click="deleteBtn(item)" class="hover" />
                       </div>
                     </div>
                     <div
@@ -210,7 +211,7 @@
         </div>
         <!-- 璧勬簮 -->
         <div class="" v-if="activeMenu == '璧勬簮'">
-          <div class="resourceBox">
+          <div class="resourceBox" v-if="classifySelectList.length > 0">
             <div class="classification">
               <div
                 v-for="item in classifySelectList"
@@ -243,6 +244,9 @@
                 <template #prefix>
                   <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>
           </div>
@@ -258,18 +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-html="item.resourceName"></div>
+                    <div class="rName" :title="item.resourceName">{{ item.resourceName }}</div>
                   </div>
                 </el-col>
               </el-row>
@@ -292,15 +290,16 @@
           <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>
@@ -312,18 +311,28 @@
           </div>
         </div>
         <!-- 鏍囩 -->
-        <div class="" v-if="activeMenu == '鏍囩'">
+        <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">
         <!-- 澶撮儴鏄剧ず -->
@@ -334,16 +343,16 @@
             <div class="">宸蹭笂璇撅細{{ headerData.classTime }}</div> -->
           </div>
           <div class="progress">
-            <div class="bookName">{{ bookName }}</div>
-            <div v-if="headerData.totlePage && bookName">
+            <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 @click="jumpContent('note' + index)">
@@ -356,10 +365,7 @@
         <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">
@@ -367,134 +373,9 @@
             </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="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"
-        @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"
-        :style="{ left: brushBoxLeft + 'px' }"
         v-if="floatingToolData.activeToolData == '鐢荤瑪'"
       >
         <div class="toolList">
@@ -560,11 +441,11 @@
               </div>
             </div>
             <template #reference>
-              <div class="floatToolItem" @click="toolSelectHandle('huabi')">
-                <div class="imgBox">
-                  <img :src="huabi2" 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>
@@ -573,31 +454,37 @@
               <div class="lineStyle">
                 <div class="lineTypeBox">
                   <div
-                    :class="toolSelectData.fontSizeActive == '14' ? 'typeItem lineTypeActive' : 'typeItem'"
+                    :class="
+                      toolSelectData.fontSizeActive == '14' ? 'typeItem lineTypeActive' : 'typeItem'
+                    "
                     @click="selectfontSize('14')"
                   >
                     灏�
                     <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '14'">
-                        <img :src="xuanzhong" />
-                      </div>
+                      <img :src="xuanzhong" />
+                    </div>
                   </div>
                   <div
-                    :class="toolSelectData.fontSizeActive == '16' ? 'typeItem lineTypeActive' : 'typeItem'"
+                    :class="
+                      toolSelectData.fontSizeActive == '16' ? 'typeItem lineTypeActive' : 'typeItem'
+                    "
                     @click="selectfontSize('16')"
                   >
                     涓�
                     <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '16'">
-                        <img :src="xuanzhong" />
-                      </div>
+                      <img :src="xuanzhong" />
+                    </div>
                   </div>
                   <div
-                    :class="toolSelectData.fontSizeActive == '18' ? 'typeItem lineTypeActive' : 'typeItem'"
+                    :class="
+                      toolSelectData.fontSizeActive == '18' ? 'typeItem lineTypeActive' : 'typeItem'
+                    "
                     @click="selectfontSize('18')"
                   >
                     澶�
                     <div class="activeIcon" v-if="toolSelectData.fontSizeActive == '18'">
-                        <img :src="xuanzhong" />
-                      </div>
+                      <img :src="xuanzhong" />
+                    </div>
                   </div>
                 </div>
                 <div class="lineStyle">
@@ -617,11 +504,10 @@
               </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>
@@ -629,8 +515,18 @@
             <div class="popinnerBox">
               <div class="graphBox">
                 <div class="graphSelect">
-
-                 
+                  <div class="flex1">
+                    <div class="square hover" @click="graphSelect('square')"></div>
+                  </div>
+                  <div class="flex1">
+                    <div class="rotundity hover" @click="graphSelect('rotundity')"></div>
+                  </div>
+                  <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">
                   <div class="colorSelectBox">
@@ -649,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="floatToolItem" @click="toolSelectHandle('xiangpi')">
             <div class="imgBox">
               <img :src="clear" alt="" />
             </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('chexiao')">
-            <div class="imgBox">
-              <img :src="clearPrevious" alt="" />
-            </div>
-            <div class="text">鎾ら攢</div>
-          </div>
-          <div class="floatToolItem" @click="toolSelectHandle('chongzuo')">
+          <!-- <div class="floatToolItem" @click="toolSelectHandle('chongzuo')">
             <div class="imgBox">
               <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="qingchu2" 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"
@@ -710,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>
@@ -730,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">
@@ -741,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
@@ -777,18 +814,6 @@
     </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="淇濆瓨鎴浘"
     align-center
     v-model="screenshotVisble"
@@ -808,12 +833,12 @@
       </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/' + 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>
@@ -828,7 +853,7 @@
     title="GGB鍑芥暟宸ュ叿"
     align-center
     v-model="functionVisible"
-    width="60%"
+    width="80%"
     class="myDialogs"
   >
     <div class="wendabox">
@@ -849,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')
 //鑾峰彇璺敱鍣�
@@ -895,22 +920,12 @@
 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'
@@ -943,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'
@@ -964,14 +980,12 @@
 const screenWidth = ref(
   window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
 )
-const brushBoxLeft = ref(500)
+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
@@ -979,8 +993,10 @@
   if (screenWidth.value < 1180) {
     menuState.open = false
     toolState.open = false
+    if (!menuState.open) {
+      floatingToolData.elLeft = 90
+    }
   }
-  brushBoxLeft.value = (screenWidth.value - 450) / 2
   window.onresize = () => {
     return (() => {
       screenWidth.value =
@@ -999,8 +1015,6 @@
 
   window.qiankunActions.onGlobalStateChange((state, prev) => {
     console.log('鐖跺眰state鍙樺寲', state)
-    bookName.value = state.bookName
-    bookId.value = state.bookId
     window.qiankunState = state
   })
 
@@ -1008,6 +1022,7 @@
   console.log(window.qiankunActions)
   window.qiankunActions.setGlobalState({
     state: 1, // 鍔犺浇瀛愬簲鐢�
+    bookId: localStorage.getItem('bookId'),
     windowSelection: (data) => {
       // 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢
       console.log(data, '瀛愬簲鐢ㄩ�夋嫨')
@@ -1021,24 +1036,28 @@
         lineDelete.left = data.x
       }
     },
+    getBookConfig: (data) => {
+      console.log(data, '鍥句功閰嶇疆')
+      bookConfig.value = data.bookConfig
+      getCatalogueData()
+      getResourceData()
+      getTextbookComponents()
+    },
     catalogChange: (data) => {
       activeCatalog.value = data.showCatalogList
       getSignData()
       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,
@@ -1047,34 +1066,196 @@
     if (screenWidth.value < 1180) {
       menuState.open = false
       toolState.open = false
-      floatingToolData.elLeft = 100
+      if (!menuState.open) {
+        floatingToolData.elLeft = 90
+      }
     } else {
-      floatingToolData.elLeft = 300
     }
   }
 )
-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, '鐩綍')
       var json = response.data
       // 澶勭悊鑾峰彇鍒扮殑json鏁版嵁
-
       catalogueData.value = json.data
       headerData.totlePage = json.data[json.data.length - 1].end
-      console.log(json[json.length - 1])
     })
     .catch(function (error) {
       console.log(error)
@@ -1099,64 +1280,202 @@
 
 //鑾峰彇璧勬簮
 //璧勬簮鍒嗙被
-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)
@@ -1164,37 +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
-  }
-  resourceDataList.value.forEach((item) => {
-    item.resourceName = '<p>' + htmlStr + '</p>'
-  })
+  getResourceData()
 }
 const searchBtn = () => {
   if (searchShow.value) {
@@ -1203,37 +1522,10 @@
     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('鐩綍')
-//璧勬簮绫诲瀷
-const resourceType = ref('default')
+
 // 鑿滃崟鐐瑰嚮
 const menuItemClick = (name) => {
   activeMenu.value = name
@@ -1250,9 +1542,10 @@
     case '鐭ヨ瘑鍥捐氨':
       break
     case '鎴浘':
-    getScreenshotList()
+      getScreenshotList()
       break
     case '涔︾':
+      getReMarkList()
       break
   }
 }
@@ -1272,16 +1565,6 @@
   // }
 }
 
-const selectResourceType = (type) => {
-  resourceType.value = type
-  if (resourceType.value == 'teacher') {
-    activeClassify.value = 'image'
-    resourceDataList.value = []
-  } else {
-    activeClassify.value = 'image'
-    resourceDataList.value = resourceImgList.value
-  }
-}
 const searchText = ref<string>('') //绛涢��
 const menuState = reactive({
   open: true,
@@ -1327,6 +1610,18 @@
   ],
   bgColorActive: '#FBF9F4'
 })
+
+watch(
+  () => menuState.open,
+  (val) => {
+    if (menuState.open == false) {
+      floatingToolData.elLeft = 90
+    } else {
+      floatingToolData.elLeft = 390
+    }
+  }
+)
+
 const fontSizeSelect = (item) => {
   settingForm.fontSizeActive = item.key
   window.qiankunActions.setGlobalState({
@@ -1362,31 +1657,11 @@
         let text = searchText.value.replace(/^\s*|\s*$/g, '')
         dataList.forEach((item) => {
           if (item.resourceName.indexOf(text) > -1) {
-            let replaceStr = "<span style='background:#F5E12A'>" + text + '</span>'
-            let htmlStr = item.resourceName.split(text).join(replaceStr)
-            item.resourceName = '<p>' + htmlStr + '</p>'
             resourceDataList.value.push(item)
           }
         })
       } else {
-        resourceDataList.value = []
-        switch (activeClassify.value) {
-          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
-        }
-        resourceDataList.value.forEach((item) => {
-          item.resourceName = '<p>' + htmlStr + '</p>'
-        })
+        getResourceData()
       }
       break
     case '鐭ヨ瘑鍥捐氨':
@@ -1395,57 +1670,11 @@
       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)
@@ -1503,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()
@@ -1597,6 +1754,11 @@
 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) => {
@@ -1607,7 +1769,7 @@
       canvasShow.value = true
       toolSelectData.activeTool = 'huabi'
       break
-    case '鏍囨敞':
+    case '鏍囪':
       break
     case '涔︾':
       reMark()
@@ -1617,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()
@@ -1685,11 +1838,105 @@
   toolSelectData.fontSizeActive = str
 }
 
-//鏍囨敞鏄剧ず闅愯棌
-const labelShow = (str) => {}
+//閫夋嫨鍥惧舰
+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 reMark = () => {}
+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() {
@@ -1703,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
 }
 //鍙栨秷鍥炶皟
@@ -1713,25 +1961,33 @@
 //淇濆瓨鎴浘
 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()
@@ -1739,6 +1995,7 @@
         urlData.value = ''
         floatingToolData.activeToolData = ''
         screenshotVisble.value = false
+        isUpdateImg.value = false
       })
       .catch(function (error) {
         screenshotLoading.value = false
@@ -1752,16 +2009,13 @@
 }
 
 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 =[]
       screenshotData.value = JSON.parse(res[0].value)
       let list = JSON.parse(res[0].value)
       list.forEach((item) => {
@@ -1769,42 +2023,61 @@
         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)
         }
       })
-      console.log(screenshotList.value,"124")
     }
   })
 }
 //鏌ョ湅鎴浘
-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(() => {})
 }
 
 //閫変腑鏂囧瓧宸ュ叿鏍�
@@ -1823,6 +2096,7 @@
 ///鍐呭閫変腑
 const getSelection = (data) => {
   if (data.txt) {
+    toolActive.value = ''
     dialogToolData.txt = data.txt
     dialogToolData.page = data.page
     dialogToolData.chapter = data.chapterNum
@@ -1835,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: baidu, name: '鐧剧' }
-  // { icon: yuyinyuedu, activeIcon: yuyinyuedu1, name: '璇煶闃呰' }
-  // { icon: cidian2, activeIcon: cidian1, name: '缈昏瘧' }
-])
+
 const colorSelectList = reactive([
   {
     label: '榛勮壊',
@@ -1971,6 +2234,7 @@
       break
     case '绗旇':
       formData.desc = ''
+      noteColorActive.value = '#F5E12A'
       addNoteVisble.value = true
       showToolBox.value = false
       break
@@ -1993,6 +2257,7 @@
       break
     case '璇嶅吀':
       cidianVisible.value = true
+      console.log(dialogToolData.txt)
       break
     case '鐧剧':
       console.log('https://baike.baidu.com/item/' + dialogToolData.txt)
@@ -2015,7 +2280,7 @@
   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({
@@ -2028,7 +2293,7 @@
       })
       break
     case '鍒掔嚎':
-      dom = 'underline-' + bookId.value
+      dom = 'underline-' + bookConfig.value.bookId
       data = dialogToolData.scribeList[dialogToolData.chapter]
       if (!data) data = []
       data.push({
@@ -2049,7 +2314,7 @@
         ElMessage.error('璇烽�夋嫨绗旇棰滆壊!')
         return
       }
-      dom = 'notes-' + bookId.value
+      dom = 'notes-' + bookConfig.value.bookId
       data = dialogToolData.notesList[dialogToolData.chapter]
       if (!data) data = []
       data.push({
@@ -2065,10 +2330,7 @@
 
       break
   }
-  request({
-    url: '/identity/api/ApiAppUserSetKey',
-    method: 'post',
-    data: {
+  MG.identity.setUserKey({
       setKeyRequests: [
         {
           domain: dom,
@@ -2076,8 +2338,7 @@
           value: JSON.stringify(data)
         }
       ]
-    }
-  }).then((res) => {
+    }).then((res) => {
     showToolBox.value = false
     addNoteVisble.value = false
     colorActive.value = ''
@@ -2089,14 +2350,10 @@
 }
 
 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]
@@ -2112,14 +2369,10 @@
       }
     }
   })
-  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]
@@ -2136,14 +2389,10 @@
       }
     }
   })
-  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]
@@ -2168,14 +2417,10 @@
     chapterList.push(item.chapter + '')
   })
   scribeData.noteList = []
-  request({
-    url: '/identity/api/ApiGetAppUserKey',
-    method: 'post',
-    data: {
-      domain: 'notes-' + bookId.value,
+  MG.identity.getUserKey({
+      domain: 'notes-' + bookConfig.value.bookId,
       keys: chapterList
-    }
-  }).then((res) => {
+    }).then((res) => {
     if (res && res.length > 0) {
       for (let i = 0; i < res.length; i++) {
         const item = res[i]
@@ -2253,19 +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
   }
   let list = data[dialogToolData.chapter].filter((item) => item.id != ids)
-  request({
-    url: '/identity/api/ApiAppUserSetKey',
-    method: 'post',
-    data: {
+  MG.identity.setUserKey({
       setKeyRequests: [
         {
           domain: dom,
@@ -2273,8 +2515,7 @@
           value: JSON.stringify(list)
         }
       ]
-    }
-  }).then((res) => {
+    }).then((res) => {
     lineDelete.showLineDelete = false
     if (window.qiankunState && window.qiankunState.delSign)
       window.qiankunState.delSign({ ids: [ids] })
@@ -2285,8 +2526,9 @@
 //绗旇璺宠浆
 const jumpContent = (item) => {
   console.log(item)
-  if (window.qiankunState && window.qiankunState.gotoPage)
+  if (window.qiankunState && window.qiankunState.gotoPage) {
     window.qiankunState.gotoPage(Number(item.chapterNum), Number(item.page))
+  }
 }
 
 //鑿滃崟绗旇缂栬緫
@@ -2304,21 +2546,18 @@
   data.noteList.forEach((itemNote) => {
     if ((itemNote.id = formData.id)) {
       itemNote.note = formData.desc
+      itemNote.color = noteColorActive.value
     }
   })
-  request({
-    url: '/identity/api/ApiAppUserSetKey',
-    method: 'post',
-    data: {
+  MG.identity.setUserKey({
       setKeyRequests: [
         {
-          domain: 'notes-' + bookId.value,
+          domain: 'notes-' + bookConfig.value.bookId,
           key: dialogToolData.chapter,
           value: JSON.stringify(data.noteList)
         }
       ]
-    }
-  }).then((res) => {
+    }).then((res) => {
     addNoteVisble.value = false
     isUpdate.value = false
     getNotesList()
@@ -2331,28 +2570,33 @@
   let data = scribeData.noteList.find((item1) => item1.chapter == Number(item.chapterNum))
   // 绉婚櫎
   let list = data.noteList.filter((itemData) => itemData.id !== item.id)
-  request({
-    url: '/identity/api/ApiAppUserSetKey',
-    method: 'post',
-    data: {
-      setKeyRequests: [
-        {
-          domain: 'notes-' + bookId.value,
-          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] })
-    }
+  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(() => {})
 }
 
 //鍐呭鍖哄煙椤堕儴鏄剧ず
@@ -2441,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;
@@ -2456,6 +2707,7 @@
     overflow: hidden;
     flex: 1;
     display: flex;
+    position: relative;
     .menuBox {
       width: 80px;
       flex-shrink: 0;
@@ -2517,6 +2769,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
+        border-bottom: 1px solid #efefef;
       }
       .resourceBox {
         padding: 10px 0;
@@ -2702,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;
             }
           }
         }
@@ -2730,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%;
@@ -2744,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;
@@ -2818,20 +3073,37 @@
         .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;
@@ -2841,6 +3113,7 @@
     .pageBox {
       flex: 1;
       font-size: 16px;
+      position: relative;
       .pageBox-header {
         height: 57px;
         padding: 0 20px;
@@ -2950,7 +3223,7 @@
       }
       .menu {
         padding-top: 20px;
-        li {
+        li > div {
           // height: 50px;
           padding: 10px 36px;
           font-size: 16px;
@@ -2964,6 +3237,7 @@
           }
 
           span {
+            width:80px;
             margin-left: 10px;
           }
         }
@@ -2973,11 +3247,10 @@
         height: 25px;
         background: #fff;
         border-radius: 3px 0px 0px 3px;
-        border: 1px solid #bce3ff;
         position: absolute;
         top: 50%;
-        right: 50px;
-        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;
@@ -2988,7 +3261,7 @@
         }
       }
       .right {
-        right: 184px !important;
+        right: 198px !important;
         border-radius: 0px 3px 3px 0px !important;
       }
       .classRoomBox {
@@ -3052,69 +3325,75 @@
     }
 
     .draggableBox {
-      width: 85px;
-      background-image: linear-gradient(to bottom, #0093ff, #005dff);
-      position: fixed;
-      height: 310px;
-      top: 300px;
-      left: 450px;
+      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;
         cursor: pointer;
-        img {
-          margin-right: 8px;
-        }
         .text {
           margin-right: 5px;
         }
       }
       .floatToolItem:hover,
       .floatToolActive {
-        background-color: #fff;
-        color: #0093ff;
+        background-color: rgba(255, 255, 255, 0.3);
       }
     }
 
     .brushBox {
-      position: fixed;
-      // left: 40%;
-      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: 6px;
-          width: 46px;
+          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: 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;
         }
       }
@@ -3124,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;
+          // }
         }
       }
     }
@@ -3186,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%;
@@ -3202,7 +3487,8 @@
 
 .myDialogs,
 .myNoteDialogs,
-.resourDialog {
+.resourDialog,
+.baiduDialog {
   padding: 0 !important;
   border-radius: 10px !important;
   overflow: hidden;
@@ -3240,6 +3526,10 @@
 .screenshotDialog {
   width: 400px !important;
 }
+.baiduDialog {
+  width: 90vw;
+  height: 90vh;
+}
 .noteColorSelectBox {
   margin-top: 10px;
   width: 190px;

--
Gitblit v1.9.1