Merge branch 'startLogin' into online

dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-5357ef54'], (function (workbox) { 'use strict';
     "revision": "6137f3202e711e407da62c90631d3729"
   }, {
     "url": "index.html",
-    "revision": "0.4248ndag8lg"
+    "revision": "0.78n63d427ro"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

index.html

@@ -106,6 +106,23 @@
         window.open('https://appstore.ks3-cn-beijing.ksyuncs.com/googlechrome-mac.dmg');
       }
     }
+    const check360 = () => {
+      console.log(navigator)
+      const result = false;
+      for (const key in navigator.plugins) {
+        // np-mswmp.dll只在360浏览器下存在
+        // if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
+        //   console.log('来到插件')
+        //   return !result;
+        // }
+        if (navigator.plugins[key].filename == 'np-mswmp.dll') {
+          console.log('来到插件')
+          return !result;
+        }
+
+      }
+      return result;
+    };
     function getChromeVersion() {
       var arr = navigator.userAgent.split(' ');
       var chromeVersion = '';
@@ -127,21 +144,54 @@
       return false;
     }
 
-    function isChrome() {
-      var isChromium = window.chrome;
-      var winNav = window.navigator;
-      var vendorName = winNav.vendor;
-      var isOpera = typeof window.opr !== 'undefined';
-      var isIEedge = winNav.userAgent.indexOf('Edge') > -1;
-      var isIOSChrome = winNav.userAgent.match('CriOS');
-      return (
-        isIOSChrome ||
-        (isChromium !== null &&
-          typeof isChromium !== 'undefined' &&
-          vendorName === 'Google Inc.' &&
-          isOpera === false &&
-          isIEedge === false)
-      );
+    const isChrome = () => {
+
+      const isChromium = window.chrome,
+        winNav = window.navigator,
+        vendorName = winNav.vendor,
+        isOpera = winNav.userAgent.indexOf('OPR') > -1,
+        isIEedge = winNav.userAgent.indexOf('Edge') > -1,
+        isIOSChrome = winNav.userAgent.match('CriOS'),
+        // QQ
+        isQQBriwser =
+          winNav.userAgent.indexOf('QQBrowser') > -1 ||
+          winNav.userAgent.indexOf('QQ') > -1,
+        // 搜狗
+        isSouggou =
+          winNav.userAgent.indexOf('se 2.x') > -1 ||
+          winNav.userAgent.indexOf('MetaSr') > -1,
+        // 360
+        is360 = check360(),
+        // 遨游
+        isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
+        // 是否为2345浏览器
+        is2345Explorer = winNav.userAgent.includes('2345Explorer'),
+        // 世界之窗
+        isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
+        // 猎豹
+        isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
+      console.log(winNav.userAgent)
+      console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
+      if (isIOSChrome) {
+        return true;
+      } else if (
+        isChromium !== null &&
+        typeof isChromium !== 'undefined' &&
+        vendorName === 'Google Inc.' &&
+        isOpera === false &&
+        isIEedge === false &&
+        isQQBriwser === false &&
+        isSouggou === false &&
+        is360 === false &&
+        isMaxthon === false &&
+        is2345Explorer === false &&
+        isTheWorld === false &&
+        isLiebao === false
+      ) {
+        return true;
+      } else {
+        return false;
+      }
     };
     function IEVersion() {
       var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
@@ -174,19 +224,16 @@
     (function (window) {
       if (!isChrome()) {
         // document.writeln("<div class='imgWrap'><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png' class='btnImg' alt=''></div>");
-
-
         if (IEVersion() < 9 && IEVersion() != -1) {
-
           document.writeln(" <div class='textWrap'><h1>当前浏览器版本过低</h1><p class='subMsg'>为了保证良好的上课体验，推荐您使用谷歌浏览器</p> <button class='subBtn' onclick='gotoLinlk()'>下载谷歌浏览器</button>");
           document.execCommand("Stop");
         } else {
           document.writeln(" <div class='imgWrap'><img onabort='this.src=this.src' src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png'  onabort='this.src=this.src' onclick='gotoLinlk()' class='btnImg' alt=''></div>");
           document.execCommand("Stop");
+          window.stop()
         }
       } else {
         if (getChromeVersion() < 90) {
-
           document.writeln(" <div class='imgWrap'><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png' onclick='gotoLinlk()' class='btnImg' alt=''></div>");
           document.execCommand("Stop");
           window.stop()

src/App.tsx

@@ -1,4 +1,10 @@
-import { computed, defineComponent, onMounted, ref, onBeforeUnmount } from 'vue';
+import {
+  computed,
+  defineComponent,
+  onMounted,
+  ref,
+  onBeforeUnmount
+} from 'vue';
 import { NConfigProvider, zhCN, dateZhCN, NModal } from 'naive-ui';
 import { AppProvider } from './components/Application';
 import { RouterView } from 'vue-router';
@@ -29,21 +35,65 @@ export default defineComponent({
     // const showModal = ref(false);
     const showModalMsg = ref('');
     // 判断浏览器
+    // 是否是360
+    const check360 = () => {
+      const result = false;
+      for (const key in navigator.plugins) {
+        // np-mswmp.dll只在360浏览器下存在
+        if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
+          return !result;
+        }
+      }
+      return result;
+    };
+    //
+
     const isChrome = () => {
-      const isChromium = (window as any).chrome;
-      const winNav = window.navigator;
-      const vendorName = winNav.vendor;
-      const isOpera = typeof (window as any).opr !== 'undefined';
-      const isIEedge = winNav.userAgent.indexOf('Edge') > -1;
-      isIOSChrome.value = winNav.userAgent.match('CriOS');
-      return (
-        isIOSChrome.value ||
-        (isChromium !== null &&
-          typeof isChromium !== 'undefined' &&
-          vendorName === 'Google Inc.' &&
-          isOpera === false &&
-          isIEedge === false)
-      );
+      const isChromium = window.chrome,
+        winNav = window.navigator,
+        vendorName = winNav.vendor,
+        isOpera = winNav.userAgent.indexOf('OPR') > -1,
+        isIEedge = winNav.userAgent.indexOf('Edge') > -1,
+        isIOSChrome = winNav.userAgent.match('CriOS'),
+        // QQ
+        isQQBriwser =
+          winNav.userAgent.indexOf('QQBrowser') > -1 ||
+          winNav.userAgent.indexOf('QQ') > -1,
+        // 搜狗
+        isSouggou =
+          winNav.userAgent.indexOf('se 2.x') > -1 ||
+          winNav.userAgent.indexOf('MetaSr') > -1,
+        // 360
+        is360 = check360() && winNav.userAgent.indexOf('Safari') > -1,
+        // 遨游
+        isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
+        // 是否为2345浏览器
+        is2345Explorer = winNav.userAgent.includes('2345Explorer'),
+        // 世界之窗
+        isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
+        // 猎豹
+        isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
+      console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
+      if (isIOSChrome) {
+        return true;
+      } else if (
+        isChromium !== null &&
+        typeof isChromium !== 'undefined' &&
+        vendorName === 'Google Inc.' &&
+        isOpera === false &&
+        isIEedge === false &&
+        isQQBriwser === false &&
+        isSouggou === false &&
+        is360 === false &&
+        isMaxthon === false &&
+        is2345Explorer === false &&
+        isTheWorld === false &&
+        isLiebao === false
+      ) {
+        return true;
+      } else {
+        return false;
+      }
     };
 
     // 获取谷歌版本
@@ -61,6 +111,7 @@ export default defineComponent({
     };
 
     const isChromeFlag = isChrome();
+    console.log('isChromeFlag', isChromeFlag);
     if (isChromeFlag) {
       const chromeVersion = getChromeVersion();
       if (!chromeVersion || (chromeVersion && chromeVersion < 100)) {

src/components/layout/index.module.less

@@ -10,12 +10,13 @@
     // .WrapcoreViewInfo {
     // border-radius: 20px;
     // background-color: #fff;
-    // overflow: hidden;
+
     // }
 
     padding: 20px 32px 32px;
     height: calc(100vh - 64px);
     overflow-y: auto;
+    // overflow: hidden;
   }
 }
 
@@ -339,8 +340,8 @@
 }
 
 .toolboxImg {
-  width: 66px;
-  height: 62px;
+  width: 83px;
+  height: 83px;
   position: absolute;
   right: 32px;
   bottom: 84px;
@@ -349,19 +350,19 @@
 }
 
 .isDragIng {
-  width: 66px;
-  height: 62px;
+  width: 83px;
+  height: 83px;
 }
 
-.toolClassImg {
-  width: 66px;
-  height: 62px;
-  position: absolute;
-  right: 32px;
-  bottom: 160px;
-  cursor: pointer;
-  z-index: 1000;
-}
+// .toolClassImg {
+//   width: 100px;
+//   height: 100px;
+//   // position: absolute;
+//   // right: 32px;
+//   // bottom: 160px;
+//   // cursor: pointer;
+//   // z-index: 1000;
+// }
 
 :global {
   .moveable-control-box {
@@ -374,7 +375,7 @@
 }
 
 .booxToolWrap {
-  width: 286px;
+  // width: 286px;
   height: 95px;
   background: #ffffff;
   box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
@@ -386,11 +387,13 @@
   justify-content: space-between;
 
   .booxToolItem {
+    margin: 0 10px;
     display: flex;
     flex-direction: column;
     align-items: center;
     font-size: 12px;
     cursor: pointer;
+    text-align: center;
 
     &:hover {
       opacity: 0.8;

src/components/layout/index.tsx

@@ -1,8 +1,8 @@
-import { Transition, defineComponent, onMounted, ref } from 'vue';
+import { Transition, defineComponent, onMounted, ref, reactive,onUnmounted } from 'vue';
 import LayoutSilder from './layoutSilder';
 import LayoutTop from './layoutTop';
 import styles from './index.module.less';
-import { NButton, NImage, NModal, NPopover, NSpace } from 'naive-ui';
+import { NButton, NImage, NModal, NPopover, NSpace, useDialog } from 'naive-ui';
 import Moveable from 'moveable';
 import toolStartClass from './images/toolStartClass.png';
 import toolbox from './images/toolbox.png';
@@ -21,6 +21,7 @@ import { px2vw, px2vwH } from '@/utils/index';
 import PlaceholderTone from './modals/placeholderTone';
 import { state } from '/src/state';
 import PreviewWindow from '/src/views/preview-window';
+import { nextTick } from 'process';
 export default defineComponent({
   name: 'layoutView',
   setup() {
@@ -32,6 +33,25 @@ export default defineComponent({
     const showModalBeat = ref(false);
     const showModalTone = ref(false);
     const showModalTime = ref(false);
+    const showBoxConent = ref(false);
+    const dialog = useDialog();
+    const boxBoundaryInfo = reactive({
+      isBoundary: true,
+      isBoundaryType: 'right' as any,
+      mainWidth: '' as any,
+      mainHeight: '' as any,
+      subWidth: '' as any,
+      subHeight: '' as any
+    });
+
+    const classBoundaryInfo = reactive({
+      isBoundary: true,
+      isBoundaryType: 'right' as any,
+      mainWidth: '' as any,
+      mainHeight: '' as any,
+      subWidth: '' as any,
+      subHeight: '' as any
+    });
     const route = useRoute();
     const isDragIng = ref(false);
     const initMoveable = async () => {
@@ -89,7 +109,7 @@ export default defineComponent({
                 width: Number(subdElStyle.width.replace('px', '')),
                 height: Number(subdElStyle.height.replace('px', ''))
               };
-
+              // target.style.transition = ''
               const mainWidth =
                 parseInt(
                   window.getComputedStyle(
@@ -103,12 +123,22 @@ export default defineComponent({
                     document.querySelector('.wrap') as Element
                   ).height
                 ) - RectInfo.height;
-
+              subdEl.style.transition = '';
+              boxBoundaryInfo.isBoundary = false;
+              boxBoundaryInfo.isBoundaryType = '';
+              boxBoundaryInfo.mainHeight = mainHeight;
+              boxBoundaryInfo.mainWidth = mainWidth;
+              boxBoundaryInfo.subWidth = RectInfo.width;
+              boxBoundaryInfo.subHeight = RectInfo.height;
               if (left < 0) {
                 left = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'left';
               }
               if (top < 0) {
                 top = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'top';
               }
               if (right < 0) {
                 right = 2;
@@ -118,9 +148,14 @@ export default defineComponent({
               }
               if (left > mainWidth - 2) {
                 left = mainWidth - 2;
+                // top = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'right';
               }
               if (top > mainHeight - 2) {
                 top = mainHeight - 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'bottom';
               }
 
               target!.style.left = `${left}px`;
@@ -130,7 +165,8 @@ export default defineComponent({
           .on(
             'dragEnd',
             async ({
-              // target, isDrag,
+              target,
+              // isDrag,
               clientX
               // clientY
             }) => {
@@ -142,6 +178,12 @@ export default defineComponent({
                 directionType.value = 'left';
               }
               isDragIng.value = false;
+              // 在这里进行动画
+              if (boxBoundaryInfo.isBoundary) {
+                // 这里说明贴边了
+                target.style.transition = '.3s';
+                actionEnd(target, boxBoundaryInfo.isBoundaryType);
+              }
             }
           );
       }
@@ -207,11 +249,22 @@ export default defineComponent({
                   ).height
                 ) - RectInfo.height;
 
+              subdEl.style.transition = '';
+              classBoundaryInfo.isBoundary = false;
+              classBoundaryInfo.isBoundaryType = '';
+              classBoundaryInfo.mainHeight = mainHeight;
+              classBoundaryInfo.mainWidth = mainWidth;
+              classBoundaryInfo.subWidth = RectInfo.width;
+              classBoundaryInfo.subHeight = RectInfo.height;
               if (left < 0) {
                 left = 2;
+                classBoundaryInfo.isBoundary = true;
+                classBoundaryInfo.isBoundaryType = 'left';
               }
               if (top < 0) {
                 top = 2;
+                classBoundaryInfo.isBoundary = true;
+                classBoundaryInfo.isBoundaryType = 'top';
               }
               if (right < 0) {
                 right = 2;
@@ -221,9 +274,14 @@ export default defineComponent({
               }
               if (left > mainWidth - 2) {
                 left = mainWidth - 2;
+                // top = 2;
+                classBoundaryInfo.isBoundary = true;
+                classBoundaryInfo.isBoundaryType = 'right';
               }
               if (top > mainHeight - 2) {
                 top = mainHeight - 2;
+                classBoundaryInfo.isBoundary = true;
+                classBoundaryInfo.isBoundaryType = 'bottom';
               }
 
               target!.style.left = `${left}px`;
@@ -233,7 +291,8 @@ export default defineComponent({
           .on(
             'dragEnd',
             async ({
-              // target, isDrag,
+              target,
+              //  isDrag,
               clientX
               // clientY
             }) => {
@@ -244,19 +303,116 @@ export default defineComponent({
                 // 往又出
                 directionType.value = 'left';
               }
+              if (classBoundaryInfo.isBoundary) {
+                // 这里说明贴边了
+                target.style.transition = '.3s';
+                actionEnd(target, classBoundaryInfo.isBoundaryType);
+              }
               isDragIng.value = false;
             }
           )
           .on('click', () => {
-            console.log(true, '1212');
             showClass.value = true;
           });
       }
     };
     onMounted(() => {
       initMoveable();
-      initMoveableClass();
+      // initMoveableClass();
+      const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
+      // const classEl = document.getElementById(
+      //   `moveNPopover2`
+      // ) as HTMLDivElement;
+      initBoxRectInfo(subdEl, boxBoundaryInfo);
+      // initBoxRectInfo(classEl, classBoundaryInfo);
+      initBoundaryWrap(subdEl, boxBoundaryInfo);
+      // initBoundaryWrap(classEl, classBoundaryInfo);
+      window.addEventListener("resize", resetSize);
     });
+
+    const resetSize = ()=>{
+      const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
+      subdEl.style.display = 'none'
+      // const boxBoundaryInfo = reactive({
+      //   isBoundary: true,
+      //   isBoundaryType: 'right' as any,
+      //   mainWidth: '' as any,
+      //   mainHeight: '' as any,
+      //   subWidth: '' as any,
+      //   subHeight: '' as any
+      // });
+
+
+        // boxBoundaryInfo.isBoundary = true;
+        // boxBoundaryInfo.isBoundaryType= 'right'
+
+        setTimeout(()=>{
+
+          subdEl.style.transition = ''
+          initBoxRectInfo(subdEl, boxBoundaryInfo);
+          initBoundaryWrap(subdEl, boxBoundaryInfo);
+          console.log('resize')
+          subdEl.style.display = 'block'
+        },100)
+
+
+
+
+
+    }
+    onUnmounted(()=>{
+      window.removeEventListener("resize", resetSize);
+    })
+    const initBoundaryWrap = (target: any, wrapInfo: any) => {
+      target.addEventListener('mouseenter', () => {
+        if (wrapInfo.isBoundary) {
+          // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
+          if (wrapInfo.isBoundaryType == 'left') {
+            target.style.left = '2px';
+          } else if (wrapInfo.isBoundaryType == 'right') {
+            target.style.left = `${wrapInfo.mainWidth - 2}px`;
+          } else if (wrapInfo.isBoundaryType == 'top') {
+            target.style.top = `${2}px`;
+          } else if (wrapInfo.isBoundaryType == 'bottom') {
+            target.style.top = `${wrapInfo.mainHeight - 2}px`;
+          }
+        }
+        rate(target, 0);
+      });
+      target.addEventListener('mouseleave', () => {
+        if (wrapInfo.isBoundary) {
+          // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
+          if (wrapInfo.isBoundaryType == 'left') {
+            actionEnd(target, 'left');
+          } else if (wrapInfo.isBoundaryType == 'right') {
+            actionEnd(target, 'right');
+          } else if (wrapInfo.isBoundaryType == 'top') {
+            actionEnd(target, 'top');
+          } else if (wrapInfo.isBoundaryType == 'bottom') {
+            actionEnd(target, 'bottom');
+          }
+        }
+        // rate(target, 0)
+      });
+      // target.addEventListener('contextmenu', (event: any) => {
+      //   event.preventDefault();
+      //   dialog.warning({
+      //     title: '提示',
+      //     content: '是否收入托盘',
+      //     positiveText: '确定',
+      //     negativeText: '取消',
+      //     onPositiveClick: () => {
+      //       console.log('确定')
+      //     },
+      //     onNegativeClick: () => {
+      //       console.log('取消')
+      //     }
+      //   })
+
+      // });
+
+      actionEnd(target, 'right');
+    };
     const startShowModal = (val: 'setTimeIcon' | 'beatIcon' | 'toneIcon') => {
       if (val == 'setTimeIcon') {
         showModalTime.value = true;
@@ -268,6 +424,75 @@ export default defineComponent({
         showModalTone.value = true;
       }
     };
+    // const moveTargetBoundary = (target: any, type: any) => {
+    //   console.log('moveTargetBoundary', target, type);
+    // };
+    // 这里是旋转
+    const rate = (target: any, rate: any) => {
+      target.style.transform = ' rotate(' + rate + ')';
+    };
+
+    //  这里是选装的方式
+    const actionEnd = (target: any, type: any) => {
+      switch (type) {
+        case 'left':
+          rate(target, '90deg');
+          target!.style.left = `${2 - boxBoundaryInfo.subWidth / 2}px`;
+          target!.style.top = `${top}px`;
+          break;
+        case 'right':
+          rate(target, '-90deg');
+          target!.style.left = `${
+            boxBoundaryInfo.mainWidth - 2 + boxBoundaryInfo.subWidth / 2
+          }px`;
+          target!.style.top = `${top}px`;
+          break;
+
+        case 'top':
+          target!.style.top = `${2 - boxBoundaryInfo.subHeight / 2}px`;
+          rate(target, '-180deg');
+          break;
+        case 'bottom':
+          target!.style.top = `${
+            boxBoundaryInfo.mainHeight - 2 + boxBoundaryInfo.subHeight / 2
+          }px`;
+          break;
+        default:
+          rate(target, '-0');
+          break;
+      }
+    };
+
+    const initBoxRectInfo = (target: any, wrapInfo: any) => {
+      // const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
+      // console.log(subdEl, "subdEl", "drag");
+      const subdElStyle = getComputedStyle(target, null);
+      const RectInfo = {
+        left: Number(subdElStyle.left.replace('px', '')),
+        top: Number(subdElStyle.top.replace('px', '')),
+        width: Number(subdElStyle.width.replace('px', '')),
+        height: Number(subdElStyle.height.replace('px', ''))
+      };
+      // target.style.transition = ''
+      const mainWidth =
+        parseInt(
+          window.getComputedStyle(document.querySelector('.wrap') as Element)
+            .width
+        ) - RectInfo.width;
+
+      const mainHeight =
+        parseInt(
+          window.getComputedStyle(document.querySelector('.wrap') as Element)
+            .height
+        ) - RectInfo.height;
+      // boxBoundaryInfo.isBoundary = false;
+      // boxBoundaryInfo.isBoundaryType = '';
+      wrapInfo.mainHeight = mainHeight;
+      wrapInfo.mainWidth = mainWidth;
+      wrapInfo.subWidth = RectInfo.width;
+      wrapInfo.subHeight = RectInfo.height;
+      target.style.transition = '.3s';
+    };
     return () => (
       <div class={[styles.wrap, 'wrap']}>
         <div>
@@ -287,7 +512,7 @@ export default defineComponent({
             {/* </div> */}
           </div>
         </div>
-        <img
+        {/* <img
           src={toolStartClass}
           id="moveNPopover2"
           style={{
@@ -303,7 +528,7 @@ export default defineComponent({
             isDragIng.value ? styles.isDragIng : ''
           ]}
           alt=""
-        />
+        /> */}
         <NPopover
           raw
           trigger="click"
@@ -349,6 +574,38 @@ export default defineComponent({
               <img src={setTimeIcon} alt="" />
               计时器
             </div>
+            <div   class={styles.booxToolItem} onClick={()=>{
+              showClass.value = true
+            }}  style={{
+                  display: [
+                    '/',
+                    '/home',
+                    '/classList',
+                    '/prepare-lessons'
+                  ].includes(route.path)
+                    ? 'none'
+                    : 'block'
+                }}>
+              <img
+                src={toolStartClass}
+
+                style={{
+                  display: [
+                    '/',
+                    '/home',
+                    '/classList',
+                    '/prepare-lessons'
+                  ].includes(route.path)
+                    ? 'none'
+                    : 'block'
+                }}
+                class={[
+                  styles.toolClassImg,
+                ]}
+                alt=""
+              />
+              开始上课
+            </div>
           </div>
         </NPopover>
 
@@ -360,7 +617,7 @@ export default defineComponent({
           style={{ width: '687px' }}>
           <div class={styles.modeWrap}>
             <iframe
-              src={`${vaildUrl()}/metronome/?id=${new Date().getTime()}`}
+              src={`${vaildUrl()} /metronome/ ? id = ${new Date().getTime()} `}
               scrolling="no"
               frameborder="0"
               width="100%"

src/components/layout/layoutTop.tsx

@@ -81,7 +81,7 @@ export default defineComponent({
               class={styles.schoolIcon}
               previewDisabled></NImage>
             <p>
-              {info.value.schoolInfos[0].tenantName} |{' '}
+              {/* {info.value.schoolInfos[0].tenantName} |{' '} */}
               {info.value.schoolInfos[0].name}
             </p>
           </div>

src/components/timerMeter/components/countdown.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, ref, watch, nextTick, onMounted,computed } from 'vue';
+import { defineComponent, ref, watch, nextTick, onMounted,computed,onUnmounted } from 'vue';
 import styles from '../index.module.less';
 import { NTabs, NTabPane, NSpace, NButton, NImage, NInput, NInputNumber } from 'naive-ui';
 import { useRoute } from 'vue-router';
@@ -155,6 +155,9 @@ export default defineComponent({
       })
 
     })
+    onUnmounted(()=>{
+      soundVIdeo.pause()
+    })
    const addSecondTimer = (num:number)=>{
 
 

src/custom-plugins/guide-page/api.ts

@@ -0,0 +1,20 @@
+import request from '@/utils/request';
+
+/**
+ * 设置引导页
+ */
+export const setGuidance = (params: any) => {
+  return request.post('/edu-app/functionGuidance/save', {
+    data: params
+  });
+};
+
+/**
+ * 获取引导页
+ */
+export const getGuidance = (params: any) => {
+  return request.get('/edu-app/functionGuidance/queryTagDetail', {
+    data: params,
+    params
+  });
+};

src/custom-plugins/guide-page/attent-guide.tsx

@@ -12,6 +12,7 @@ import styles from './index.module.less';
 import { getImage } from './images';
 import { px2vw, px2vwH } from '@/utils/index';
 import { useRoute } from 'vue-router';
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'attent-guide',
   emits: ['close'],
@@ -133,12 +134,28 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).attentGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value &&guideInfo.value.attentGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+
+    getAllGuidance()
     const getStepELe = () => {
       const ele: HTMLElement = document.getElementById(`attent-${data.step}`)!;
 
@@ -180,16 +197,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { attentGuide: true };
+    const endGuide = async() => {
+
+      if (!guideInfo.value) {
+        guideInfo.value = { attentGuide: true };
       } else {
-        guideInfo.attentGuide = true;
+        guideInfo.value.attentGuide = true;
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
+      }
       //  localStorage.setItem('endC')
     };
     return () => (

src/custom-plugins/guide-page/class-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import { px2vw, px2vwH } from '@/utils/index';
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'coai-guide',
   emits: ['close'],
@@ -95,12 +96,34 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).classGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.classGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).classGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
       const ele: HTMLElement = document.getElementById(`class-${data.step}`)!;
 
@@ -143,15 +166,18 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { classGuide: true };
+    const endGuide = async() => {
+
+      if (!guideInfo.value) {
+        guideInfo.value = { classGuide: true };
       } else {
-        guideInfo.classGuide = true;
+        guideInfo.value.classGuide = true;
+      }
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/data-guide.tsx

@@ -10,6 +10,7 @@ import {
 } from 'vue';
 import styles from './index.module.less';
 import { getImage } from './images';
+import {getGuidance,setGuidance} from './api'
 import {px2vw,px2vwH} from '@/utils/index'
 export default defineComponent({
   name: 'data-guide',
@@ -106,12 +107,34 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).dataGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.dataGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).dataGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`data-${data.step}`)!;
@@ -155,15 +178,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { dataGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { dataGuide: true };
       } else {
-        guideInfo.dataGuide = true;
+        guideInfo.value.dataGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/home-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'coai-guide',
   emits: ['close'],
@@ -172,12 +173,30 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).homeGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+
+
+        if (guideInfo.value && guideInfo.value.homeGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`home-${data.step}`)!;
@@ -219,15 +238,20 @@ export default defineComponent({
       getStepELe();
     }
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { homeGuide: true };
+    const endGuide = async () => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { homeGuide: true };
       } else {
-        guideInfo.homeGuide = true;
+        guideInfo.value.homeGuide = true;
+      }
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/lessons-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'lessons-guide',
   emits: ['close'],
@@ -144,12 +145,34 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).lessonsGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.lessonsGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).lessonsGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`lessons-${data.step}`)!;
@@ -193,15 +216,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { lessonsGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { lessonsGuide: true };
       } else {
-        guideInfo.lessonsGuide = true;
+        guideInfo.value.lessonsGuide = true;
+      }
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/music-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'music-guide',
   emits: ['close'],
@@ -102,12 +103,33 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).musicGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.musicGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).musicGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`music-${data.step}`)!;
@@ -155,15 +177,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { musicGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo')|| '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { musicGuide: true };
       } else {
-        guideInfo.musicGuide = true;
+        guideInfo.value.musicGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/myColloge-guide.tsx

@@ -11,7 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw} from '@/utils/index'
-
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'myColloge-guide',
   emits: ['close'],
@@ -55,12 +55,32 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).myColloge) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.myColloge) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).myColloge) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`myColloge-${data.step}`)!;
@@ -103,15 +123,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { myColloge: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { myColloge: true };
       } else {
-        guideInfo.myColloge = true;
+        guideInfo.value.myColloge = true;
+      }
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/myResources-guide.tsx

@@ -11,7 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw} from '@/utils/index'
-
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'myResources-guide',
   emits: ['close'],
@@ -59,12 +59,34 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).myResourcesGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.myResourcesGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).myResourcesGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`myResources-${data.step}`)!;
@@ -108,15 +130,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { myResourcesGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (guideInfo.value) {
+        guideInfo.value = { myResourcesGuide: true };
       } else {
-        guideInfo.myResourcesGuide = true;
+        guideInfo.value.myResourcesGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/shareResources-guide.tsx

@@ -11,7 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw} from '@/utils/index'
-
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'shareResources-guide',
   emits: ['close'],
@@ -51,7 +51,7 @@ export default defineComponent({
             height:28
           },
           boxStyle:{
-            borderRadius: '30px'
+            borderRadius: '30px',
           },
         },
         {
@@ -59,13 +59,13 @@ export default defineComponent({
           img: getImage('shareResources2.png'),
           imgStyle: {
 
-            left:  px2vw(134),
-            width: px2vw(515),
-            height:px2vw(227)
+            left:  px2vw(99),
+            width: px2vw(618),
+            height:px2vw(273)
           },
           btnsStyle: {
-            bottom: px2vw(75),
-            left: px2vw(253),
+            bottom: px2vw(88),
+            left: px2vw(240),
           },
 
           eleRectPadding:{
@@ -84,12 +84,33 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).shareResourcesGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.shareResourcesGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).shareResourcesGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`shareResources-${data.step}`)!;
@@ -144,15 +165,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo')||'{}') || null;
-      if (!guideInfo) {
-        guideInfo = { shareResourcesGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo')||'{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { shareResourcesGuide: true };
       } else {
-        guideInfo.shareResourcesGuide = true;
+        guideInfo.value.shareResourcesGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/student-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'coai-guide',
   emits: ['close'],
@@ -79,12 +80,33 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).studentGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.studentGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).studentGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`student-${data.step}`)!;
@@ -127,15 +149,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { studentGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { studentGuide: true };
       } else {
-        guideInfo.studentGuide = true;
+        guideInfo.value.studentGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/teacher-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'teacher-guide',
   emits: ['close'],
@@ -81,12 +82,34 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).teacherGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).teacherGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
+
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.teacherGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`teacher-${data.step}`)!;
@@ -130,15 +153,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { teacherGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { teacherGuide: true };
       } else {
-        guideInfo.teacherGuide = true;
+        guideInfo.value.teacherGuide = true;
+      }
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/custom-plugins/guide-page/train-guide.tsx

@@ -11,6 +11,7 @@ import {
 import styles from './index.module.less';
 import { getImage } from './images';
 import {px2vw,px2vwH} from '@/utils/index'
+import {getGuidance,setGuidance} from './api'
 export default defineComponent({
   name: 'train-guide',
   emits: ['close'],
@@ -56,12 +57,33 @@ export default defineComponent({
       step: 0
     });
     const tipShow = ref(false);
-    const guideInfo = localStorage.getItem('teacher-guideInfo');
-    if (guideInfo && JSON.parse(guideInfo).trainGuide) {
-      tipShow.value = false;
-    } else {
-      tipShow.value = true;
+    const guideInfo = ref({} as any)
+    const getAllGuidance = async()=>{
+      try{
+        const res = await getGuidance({guideTag:'teacher-guideInfo'})
+        if(res.data){
+          guideInfo.value = JSON.parse(res.data?.guideValue) || null
+        }else{
+          guideInfo.value = {}
+        }
+        if (guideInfo.value && guideInfo.value.trainGuide) {
+          tipShow.value = false;
+        } else {
+          tipShow.value = true;
+        }
+      }catch(e){
+        console.log(e)
+      }
+      // const guideInfo = localStorage.getItem('teacher-guideInfo');
+
     }
+    getAllGuidance()
+    // const guideInfo = localStorage.getItem('teacher-guideInfo');
+    // if (guideInfo && JSON.parse(guideInfo).trainGuide) {
+    //   tipShow.value = false;
+    // } else {
+    //   tipShow.value = true;
+    // }
     const getStepELe = () => {
 
       const ele: HTMLElement = document.getElementById(`train-${data.step}`)!;
@@ -104,15 +126,20 @@ export default defineComponent({
       getStepELe();
     };
 
-    const endGuide = () => {
-      let guideInfo =
-        JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
-      if (!guideInfo) {
-        guideInfo = { trainGuide: true };
+    const endGuide = async() => {
+      // let guideInfo =
+      //   JSON.parse(localStorage.getItem('teacher-guideInfo') || '{}') || null;
+      if (!guideInfo.value) {
+        guideInfo.value = { trainGuide: true };
       } else {
-        guideInfo.trainGuide = true;
+        guideInfo.value.trainGuide = true;
+      }
+      try{
+        const res = await setGuidance({guideTag:'teacher-guideInfo',guideValue:JSON.stringify(guideInfo.value)})
+      }catch(e){
+        console.log(e)
       }
-      localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
+      // localStorage.setItem('teacher-guideInfo', JSON.stringify(guideInfo));
       tipShow.value = false;
       //  localStorage.setItem('endC')
     };

src/styles/index.less

@@ -11,11 +11,13 @@
   -moz-osx-font-smoothing: grayscale;
   color: #333;
   min-height: 100vh;
+
 }
 
 body {
   user-select: none;
   background-color: #f1f5ff;
+  overflow: hidden;
 }
 
 // 搜索框前面放大镜样式重置

src/views/attend-class/index.module.less

@@ -436,8 +436,8 @@
 
 
 .toolboxImg {
-  width: 66px;
-  height: 62px;
+  width: 83px;
+  height: 83px;
   position: absolute;
   right: 16px;
   bottom: 164px;
@@ -446,13 +446,13 @@
 }
 
 .isDragIng {
-  width: 66px;
-  height: 62px;
+  width: 83px;
+  height: 83px;
 }
 
 .toolClassImg {
-  width: 66px;
-  height: 62px;
+  width: 83px;
+  height: 83px;
   position: absolute;
   right: 32px;
   bottom: 160px;
@@ -471,7 +471,7 @@
 }
 
 .booxToolWrap {
-  width: 286px;
+  // width: 286px;
   height: 95px;
   background: #ffffff;
   box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
@@ -484,6 +484,7 @@
   overflow: hidden;
 
   .booxToolItem {
+    margin: 0 10px;
     display: flex;
     flex-direction: column;
     align-items: center;

src/views/attend-class/index.tsx

@@ -102,6 +102,15 @@ export default defineComponent({
       // setContainer();
     };
     handleInit();
+    const boxBoundaryInfo = reactive({
+      isBoundary: true,
+      isBoundaryType: 'right' as any,
+      mainWidth: '' as any,
+      mainHeight: '' as any,
+      subWidth: '' as any,
+      subHeight: '' as any
+    });
+
     onUnmounted(() => {
       handleInit(1);
     });
@@ -245,7 +254,7 @@ export default defineComponent({
                 width: Number(subdElStyle.width.replace('px', '')),
                 height: Number(subdElStyle.height.replace('px', ''))
               };
-
+              // target.style.transition = ''
               const mainWidth =
                 parseInt(
                   window.getComputedStyle(
@@ -259,12 +268,22 @@ export default defineComponent({
                     document.querySelector('.wrap') as Element
                   ).height
                 ) - RectInfo.height;
-
+              subdEl.style.transition = '';
+              boxBoundaryInfo.isBoundary = false;
+              boxBoundaryInfo.isBoundaryType = '';
+              boxBoundaryInfo.mainHeight = mainHeight;
+              boxBoundaryInfo.mainWidth = mainWidth;
+              boxBoundaryInfo.subWidth = RectInfo.width;
+              boxBoundaryInfo.subHeight = RectInfo.height;
               if (left < 0) {
                 left = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'left';
               }
               if (top < 0) {
                 top = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'top';
               }
               if (right < 0) {
                 right = 2;
@@ -274,9 +293,14 @@ export default defineComponent({
               }
               if (left > mainWidth - 2) {
                 left = mainWidth - 2;
+                // top = 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'right';
               }
               if (top > mainHeight - 2) {
                 top = mainHeight - 2;
+                boxBoundaryInfo.isBoundary = true;
+                boxBoundaryInfo.isBoundaryType = 'bottom';
               }
 
               target!.style.left = `${left}px`;
@@ -286,7 +310,8 @@ export default defineComponent({
           .on(
             'dragEnd',
             async ({
-              // target, isDrag,
+              target,
+              // isDrag,
               clientX
               // clientY
             }) => {
@@ -298,6 +323,12 @@ export default defineComponent({
                 directionType.value = 'left';
               }
               isDragIng.value = false;
+              // 在这里进行动画
+              if (boxBoundaryInfo.isBoundary) {
+                // 这里说明贴边了
+                target.style.transition = '.3s';
+                actionEnd(target, boxBoundaryInfo.isBoundaryType);
+              }
             }
           );
       }
@@ -323,10 +354,130 @@ export default defineComponent({
       data.detailId = props.detailId || query.detailId;
       data.classGroupId = props.classGroupId || query.classGroupId;
       initMoveable();
+
+      const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
+      initBoxRectInfo(subdEl, boxBoundaryInfo);
+
+      initBoundaryWrap(subdEl, boxBoundaryInfo);
       window.addEventListener('message', iframeHandle);
       getDetail();
     });
+    const initBoundaryWrap = (target: any, wrapInfo: any) => {
+      target.addEventListener('mouseenter', () => {
+        if (wrapInfo.isBoundary) {
+          // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
+          if (wrapInfo.isBoundaryType == 'left') {
+            target.style.left = '2px';
+          } else if (wrapInfo.isBoundaryType == 'right') {
+            target.style.left = `${wrapInfo.mainWidth - 2}px`;
+          } else if (wrapInfo.isBoundaryType == 'top') {
+            target.style.top = `${2}px`;
+          } else if (wrapInfo.isBoundaryType == 'bottom') {
+            target.style.top = `${wrapInfo.mainHeight - 2}px`;
+          }
+        }
+        rate(target, 0);
+      });
+      target.addEventListener('mouseleave', () => {
+        if (wrapInfo.isBoundary) {
+          // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
+          if (wrapInfo.isBoundaryType == 'left') {
+            actionEnd(target, 'left');
+          } else if (wrapInfo.isBoundaryType == 'right') {
+            actionEnd(target, 'right');
+          } else if (wrapInfo.isBoundaryType == 'top') {
+            actionEnd(target, 'top');
+          } else if (wrapInfo.isBoundaryType == 'bottom') {
+            actionEnd(target, 'bottom');
+          }
+        }
+        // rate(target, 0)
+      });
+      // target.addEventListener('contextmenu', (event: any) => {
+      //   event.preventDefault();
+      //   dialog.warning({
+      //     title: '提示',
+      //     content: '是否收入托盘',
+      //     positiveText: '确定',
+      //     negativeText: '取消',
+      //     onPositiveClick: () => {
+      //       console.log('确定')
+      //     },
+      //     onNegativeClick: () => {
+      //       console.log('取消')
+      //     }
+      //   })
+
+      // });
 
+      actionEnd(target, 'right');
+    };
+    // 这里是旋转
+    const rate = (target: any, rate: any) => {
+      target.style.transform = ' rotate(' + rate + ')';
+    };
+
+    //  这里是选装的方式
+    const actionEnd = (target: any, type: any) => {
+      switch (type) {
+        case 'left':
+          rate(target, '90deg');
+          target!.style.left = `${2 - boxBoundaryInfo.subWidth / 2}px`;
+          target!.style.top = `${top}px`;
+          break;
+        case 'right':
+          rate(target, '-90deg');
+          target!.style.left = `${
+            boxBoundaryInfo.mainWidth - 2 + boxBoundaryInfo.subWidth / 2
+          }px`;
+          target!.style.top = `${top}px`;
+          break;
+
+        case 'top':
+          target!.style.top = `${2 - boxBoundaryInfo.subHeight / 2}px`;
+          rate(target, '-180deg');
+          break;
+        case 'bottom':
+          target!.style.top = `${
+            boxBoundaryInfo.mainHeight - 2 + boxBoundaryInfo.subHeight / 2
+          }px`;
+          break;
+        default:
+          rate(target, '-0');
+          break;
+      }
+    };
+
+    const initBoxRectInfo = (target: any, wrapInfo: any) => {
+      // const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
+      // console.log(subdEl, "subdEl", "drag");
+      const subdElStyle = getComputedStyle(target, null);
+      const RectInfo = {
+        left: Number(subdElStyle.left.replace('px', '')),
+        top: Number(subdElStyle.top.replace('px', '')),
+        width: Number(subdElStyle.width.replace('px', '')),
+        height: Number(subdElStyle.height.replace('px', ''))
+      };
+      // target.style.transition = ''
+      const mainWidth =
+        parseInt(
+          window.getComputedStyle(document.querySelector('.wrap') as Element)
+            .width
+        ) - RectInfo.width;
+
+      const mainHeight =
+        parseInt(
+          window.getComputedStyle(document.querySelector('.wrap') as Element)
+            .height
+        ) - RectInfo.height;
+      // boxBoundaryInfo.isBoundary = false;
+      // boxBoundaryInfo.isBoundaryType = '';
+      wrapInfo.mainHeight = mainHeight;
+      wrapInfo.mainWidth = mainWidth;
+      wrapInfo.subWidth = RectInfo.width;
+      wrapInfo.subHeight = RectInfo.height;
+      target.style.transition = '.3s';
+    };
     const onFullScreen = () => {
       if (data.type === 'preview') {
         const el: any = document.querySelector('#app');
@@ -1194,14 +1345,13 @@ export default defineComponent({
                 onClick={() => {
                   //
                   if (state.application) {
-
                     document.exitFullscreen
-                    ? document.exitFullscreen()
-                    : document.mozCancelFullScreen
-                    ? document.mozCancelFullScreen()
-                    : document.webkitExitFullscreen
-                    ? document.webkitExitFullscreen()
-                    : ''
+                      ? document.exitFullscreen()
+                      : document.mozCancelFullScreen
+                      ? document.mozCancelFullScreen()
+                      : document.webkitExitFullscreen
+                      ? document.webkitExitFullscreen()
+                      : '';
                     emit('close');
                   } else {
                     window.close();

src/views/login/index.tsx

@@ -82,8 +82,8 @@ export default defineComponent({
     })
 
     onMounted(async () => {
-      const relatedApps = await navigator.getInstalledRelatedApps();
-      console.log(relatedApps)
+      // const relatedApps = await navigator?.getInstalledRelatedApps();
+
 
       //
 

src/views/natural-resources/components/share-resources/index.tsx

@@ -34,6 +34,7 @@ export default defineComponent({
       item: {} as any
     });
     const showGuide = ref(false);
+    const SearchGroupResourcesRef = ref()
     const getList = async () => {
       try {
         state.loading = true;
@@ -91,10 +92,10 @@ export default defineComponent({
     return () => (
       <>
         <SearchGroupResources
+        ref={SearchGroupResourcesRef}
           onSearch={(item: any) => onSearch(item)}
           onAdd={() => (state.teachingStatus = true)}
         />
-
         <NSpin v-model:show={state.loading} style={{ 'min-height': '50vh' }}>
           <div class={styles.list}>
             {state.tableList.map((item: any, index: number) => (

src/views/natural-resources/components/share-resources/search-group-resources.tsx

@@ -9,6 +9,7 @@ import isCollaose from '../../images/isCollaose.png';
 export default defineComponent({
   name: 'search-group',
   emits: ['search', 'add'],
+  expose: ['init'],
   setup(props, { emit }) {
     const catchStore = useCatchStore();
     const forms = reactive({
@@ -19,8 +20,14 @@ export default defineComponent({
     });
 
     const onSearch = () => {
+      console.log('onSearch')
+      divDomList.value = []
+      setCollapse(true)
       emit('search', forms);
     };
+    const init = () => {
+      setCollapse(false)
+    }
     const collapseWrapRef = ref();
     const divDomList = ref([] as any);
     const orginHeight = ref(0);
@@ -28,7 +35,9 @@ export default defineComponent({
     const line = ref(0);
     const isCollapse = ref(false);
     const musicCateRef = (el: any) => {
-      if (el?.selfElRef) {
+      console.log('musicCateRef', musicCateRef)
+      // console.log(el?.selfElRef, 'el.selfElRef')
+      if (el?.selfElRef?.parentNode) {
         divDomList.value.push(el.selfElRef.parentNode);
       }
     };
@@ -37,8 +46,10 @@ export default defineComponent({
       getLive();
     };
     const getLive = () => {
+      console.log(divDomList.value.length)
       divDomList.value = [...new Set(divDomList.value)];
       let offsetLeft = -1;
+      console.log(divDomList.value, '  divDomList.value')
       divDomList.value.forEach((item: any, index: number) => {
         if (index === 0) {
           line.value = 1;
@@ -49,7 +60,7 @@ export default defineComponent({
         }
         if (!isCollapse.value) {
           if (line.value > 1) {
-            //从第3行开始 隐藏标签
+            //从第2行开始 隐藏标签
             item.style.display = 'none';
             // 显示展开按钮  class名chu是在前面动态添加的
           } else {
@@ -61,16 +72,19 @@ export default defineComponent({
       });
     };
     onMounted(async () => {
+      console.log('加载')
       // 获取教材分类列表
       await catchStore.getMusicSheetCategory();
       // 获取声部列表
       await catchStore.getSubjects();
 
-      // 这里开始
+
       orginHeight.value = collapseWrapRef.value.offsetHeight;
       hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
       // 默认隐藏
-      getLive();
+      setCollapse(false)
+      // 这里开始
+
     });
     return () => (
       <div class={styles.searchGroup}>

src/views/notation/index.tsx

@@ -18,12 +18,32 @@ export default defineComponent({
     const data = reactive({
       src: `${
         /(192|localhost)/.test(location.origin)
-          ? // ? 'https://test.lexiaoya.cn'
+          ? // ?
+          // 'https://test.lexiaoya.cn'
             'http://localhost:3050'
           : location.origin
       }/notation/#/create?Authorization=${Authorization}`
       //   src: `http://localhost:3050/#/create?Authorization=${Authorization}`
     });
+    const fscreen=()=> {
+      const el = document.documentElement
+      const isFullscreen = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen
+      if (!isFullscreen) {
+        //进入全屏
+        (el.requestFullscreen && el.requestFullscreen()) ||
+        (el.mozRequestFullScreen && el.mozRequestFullScreen()) ||
+        (el.webkitRequestFullscreen && el.webkitRequestFullscreen()) ||
+        (el.msRequestFullscreen && el.msRequestFullscreen())
+      } else {
+        //退出全屏
+        document.exitFullscreen
+          ? document.exitFullscreen()
+          : document.mozCancelFullScreen
+          ? document.mozCancelFullScreen()
+          : document.webkitExitFullscreen
+          ? document.webkitExitFullscreen()
+          : ''
+      }}
     const handleOpen = (e: MessageEvent) => {
       console.log(e.data, 'data');
       if (e.data.api === 'notation_open') {
@@ -33,6 +53,7 @@ export default defineComponent({
           previewParams.value = {
             url: e.data.url
           };
+          fscreen()
         } else {
           window.open(e.data.url);
         }
@@ -86,7 +107,9 @@ export default defineComponent({
                     },
                     '*'
                   );
-                }}>
+                  if (state.application) {
+                    fscreen()
+                }}}>
                 确定
               </NButton>
               <NButton round onClick={() => (removeVisiable.value = false)}>

src/views/prepare-lessons/components/lesson-main/courseware/index.tsx

@@ -195,11 +195,14 @@ export default defineComponent({
       console.log(state.application, 'state.application');
       if (state.application) {
         forms.previewModal = true;
+        fscreen()
         forms.previewParams = {
           type: 'preview',
           subjectId: prepareStore.getSubjectId,
           detailId: prepareStore.getSelectKey
         };
+
+
       } else {
         const { href } = router.resolve({
           path: '/attend-class',
@@ -212,7 +215,16 @@ export default defineComponent({
         window.open(href, +new Date() + '');
       }
     };
-
+    const fscreen=()=> {
+      const el = document.documentElement
+      const isFullscreen = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen
+      if (!isFullscreen) {
+        //进入全屏
+        (el.requestFullscreen && el.requestFullscreen()) ||
+        (el.mozRequestFullScreen && el.mozRequestFullScreen()) ||
+        (el.webkitRequestFullscreen && el.webkitRequestFullscreen()) ||
+        (el.msRequestFullscreen && el.msRequestFullscreen())
+      } }
     // 单个删除
     const onRemove = async (item: any) => {
       try {