Merge branch 'startLogin'

src/components/layout/index.tsx

@@ -1,4 +1,12 @@
-import { Transition, defineComponent, onMounted, ref, reactive,onUnmounted } from 'vue';
+import {
+  Transition,
+  defineComponent,
+  onMounted,
+  ref,
+  reactive,
+  onUnmounted,
+  watch
+} from 'vue';
 import LayoutSilder from './layoutSilder';
 import LayoutTop from './layoutTop';
 import styles from './index.module.less';
@@ -21,7 +29,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 {fscreen} from '@/utils/index'
+import { fscreen } from '@/utils/index';
 export default defineComponent({
   name: 'layoutView',
   setup() {
@@ -37,8 +45,8 @@ export default defineComponent({
     const showBoxConent = ref(false);
     const dialog = useDialog();
     const boxBoundaryInfo = reactive({
-      isBoundary: true,
-      isBoundaryType: 'right' as any,
+      isBoundary: false,
+      isBoundaryType: '' as any,
       mainWidth: '' as any,
       mainHeight: '' as any,
       subWidth: '' as any,
@@ -55,7 +63,7 @@ export default defineComponent({
     });
     const route = useRoute();
     const isDragIng = ref(false);
-    const NPopoverRef = ref()
+    const NPopoverRef = ref();
     const initMoveable = async () => {
       if (document.querySelector('.wrap')) {
         const moveable = new Moveable(document.querySelector('.wrap') as any, {
@@ -100,8 +108,8 @@ export default defineComponent({
               // clientY
             }) => {
               isDragIng.value = true;
-              if(NPopoverRef.value){
-                NPopoverRef.value.setShow(false)
+              if (NPopoverRef.value) {
+                NPopoverRef.value.setShow(false);
               }
 
               const subdEl = document.getElementById(
@@ -322,6 +330,17 @@ export default defineComponent({
           });
       }
     };
+
+    watch(
+      () => route.path,
+      (val: any) => {
+        const elDoc = document.getElementById('WrapcoreViewWrap') as any;
+        if (elDoc) {
+          elDoc.scrollTo(0, 0);
+          window.scrollTo(0, 0);
+        }
+      }
+    );
     onMounted(() => {
       initMoveable();
       // // initMoveableClass();
@@ -329,16 +348,17 @@ export default defineComponent({
       // // const classEl = document.getElementById(
       // //   `moveNPopover2`
       // // ) as HTMLDivElement;
-      initBoxRectInfo(subdEl, boxBoundaryInfo);
+
       // // initBoxRectInfo(classEl, classBoundaryInfo);
       initBoundaryWrap(subdEl, boxBoundaryInfo);
+      initBoxRectInfo(subdEl, boxBoundaryInfo);
       // // initBoundaryWrap(classEl, classBoundaryInfo);
-      window.addEventListener("resize", resetSize);
+      window.addEventListener('resize', resetSize);
     });
 
-    const resetSize = ()=>{
+    const resetSize = () => {
       const subdEl = document.getElementById(`moveNPopover`) as HTMLDivElement;
-      subdEl.style.display = 'none'
+      subdEl.style.display = 'none';
       // const boxBoundaryInfo = reactive({
       //   isBoundary: true,
       //   isBoundaryType: 'right' as any,
@@ -348,32 +368,25 @@ export default defineComponent({
       //   subHeight: '' as any
       // });
 
+      // boxBoundaryInfo.isBoundary = true;
+      // boxBoundaryInfo.isBoundaryType= 'right'
+      if (NPopoverRef.value) {
+        NPopoverRef.value.setShow(false);
+      }
 
-        // boxBoundaryInfo.isBoundary = true;
-        // boxBoundaryInfo.isBoundaryType= 'right'
-        if(NPopoverRef.value){
-          NPopoverRef.value.setShow(false)
-        }
-
-        setTimeout(()=>{
-
-          subdEl.style.transition = ''
-          initBoxRectInfo(subdEl, boxBoundaryInfo);
-          initBoundaryWrap(subdEl, boxBoundaryInfo);
-          console.log('resize')
-          subdEl.style.display = 'block'
-        },100)
-
-
-
-
-
-    }
-    onUnmounted(()=>{
-      window.removeEventListener("resize", resetSize);
-    })
+      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', () => {
+      target.addEventListener('mouseover', () => {
         if (wrapInfo.isBoundary) {
           // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
           if (wrapInfo.isBoundaryType == 'left') {
@@ -387,8 +400,9 @@ export default defineComponent({
           }
         }
         rate(target, 0);
+
       });
-      target.addEventListener('mouseleave', () => {
+      target.addEventListener('mouseout', () => {
         if (wrapInfo.isBoundary) {
           // 如果在边框 就得还原 元素位置 还原完毕后 去除transition
           if (wrapInfo.isBoundaryType == 'left') {
@@ -411,16 +425,15 @@ export default defineComponent({
           positiveText: '确定',
           negativeText: '取消',
           onPositiveClick: () => {
-            console.log('确定')
+            console.log('确定');
           },
           onNegativeClick: () => {
-            console.log('取消')
+            console.log('取消');
           }
-        })
-
+        });
       });
 
-      actionEnd(target, 'right');
+      // actionEnd(target, 'right');
     };
     const startShowModal = (val: 'setTimeIcon' | 'beatIcon' | 'toneIcon') => {
       if (val == 'setTimeIcon') {
@@ -443,7 +456,6 @@ export default defineComponent({
 
     //  这里是选装的方式
     const actionEnd = (target: any, type: any) => {
-
       switch (type) {
         case 'left':
           rate(target, '90deg');
@@ -501,7 +513,7 @@ export default defineComponent({
       wrapInfo.mainWidth = mainWidth;
       wrapInfo.subWidth = RectInfo.width;
       wrapInfo.subHeight = RectInfo.height;
-      target.style.transition = '.3s';
+      target.style.transition = '.3s .3s';
     };
     return () => (
       <div class={[styles.wrap, 'wrap']}>
@@ -510,7 +522,7 @@ export default defineComponent({
         </div>
         <div class={styles.Wrapcore}>
           <LayoutTop></LayoutTop>
-          <div class={styles.WrapcoreView}>
+          <div class={styles.WrapcoreView} id="WrapcoreViewWrap">
             {/* <div class={styles.WrapcoreViewInfo}> */}
             <router-view>
               {(obj: any) => (
@@ -585,21 +597,23 @@ 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'
-                }}>
+            <div
+              class={styles.booxToolItem}
+              onClick={() => {
+                showClass.value = true;
+              }}
+              style={{
+                display: [
+                  '/',
+                  '/home',
+                  '/classList',
+                  '/prepare-lessons'
+                ].includes(route.path)
+                  ? 'none'
+                  : 'block'
+              }}>
               <img
                 src={toolStartClass}
-
                 style={{
                   display: [
                     '/',
@@ -610,9 +624,7 @@ export default defineComponent({
                     ? 'none'
                     : 'block'
                 }}
-                class={[
-                  styles.toolClassImg,
-                ]}
+                class={[styles.toolClassImg]}
                 alt=""
               />
               开始上课
@@ -676,8 +688,10 @@ export default defineComponent({
                 previewItem.value = {
                   ...item
                 };
-                state.application = window.matchMedia('(display-mode: standalone)').matches
-                fscreen()
+                state.application = window.matchMedia(
+                  '(display-mode: standalone)'
+                ).matches;
+                fscreen();
               } else {
                 const { href } = router.resolve({
                   path: '/attend-class',

src/router/index.ts

@@ -92,14 +92,7 @@ const router: Router = createRouter({
   routes: [...constantRoutes],
   stringifyQuery,
   parseQuery,
-  scrollBehavior(to) {
-    if (to.hash) {
-      return {
-        el: to.hash,
-        behavior: 'smooth'
-      };
-    }
-  }
+  scrollBehavior: () => ({ top: 0 })
 });
 
 export function setupRouter(app: App) {

src/views/login/index.module.less

@@ -319,4 +319,43 @@
     }
 
   }
+}
+
+
+.alertWrap {
+  padding: 14px 17px;
+  width: 620px;
+  height: 46px;
+  background: #E6F4FF;
+  border-radius: 9px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+
+  .alertInfo {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+
+    .infoIcon {
+      width: 20px;
+      height: 20px;
+      margin-right: 8px;
+    }
+
+    font-size: 16px;
+    font-family: PingFangSC-Regular,
+    PingFang SC;
+    font-weight: 400;
+    color: rgba(0, 0, 0, 0.88);
+  }
+
+  .down {
+    font-size: 16px;
+    font-weight: 500;
+    color: #1677FF;
+    cursor: pointer;
+  }
+
 }

src/views/login/index.tsx

@@ -5,12 +5,13 @@ import loginRight from './images/loginright.png';
 import colLogo from './images/colLogo.png';
 import CodeLogin from './components/codeLogin';
 import PwdLogin from './components/pwdLogin';
-import { NTabs, NTabPane, useDialog, NModal, NButton, NSpace } from 'naive-ui';
+import { NTabs, NTabPane, useDialog, NModal, NButton, NSpace,NAlert, NImage } from 'naive-ui';
 import styles from './index.module.less';
 import ForgotPassword from './components/forgotPassword';
 import moveTop from './images/moveTopBg.png'
 import dingPng from './images/ding.png'
 import closeAble from './images/closeAble.png'
+import infoIcon from './images/infoIcon.png'
 import { state } from '/src/state';
 export default defineComponent({
   name: 'login-page',
@@ -85,11 +86,22 @@ export default defineComponent({
 
     onMounted(async () => {
       // const relatedApps = await navigator?.getInstalledRelatedApps();
-
-
       //
 
     })
+    const downChrome = ()=>{
+      const agent = navigator.userAgent.toLowerCase();
+      const isMac = function () { return /macintosh|mac os x/i.test(navigator.userAgent); }();
+      if (agent.indexOf("win32") >= 0 || agent.indexOf("wow32") >= 0) {
+        window.open('https://appstore.ks3-cn-beijing.ksyuncs.com/ChromeStandaloneSetup32.exe');
+      }
+      if (agent.indexOf("win64") >= 0 || agent.indexOf("wow64") >= 0) {
+        window.open('https://appstore.ks3-cn-beijing.ksyuncs.com/ChromeStandaloneSetup64.exe');
+      }
+      if (isMac) {
+        window.open('https://appstore.ks3-cn-beijing.ksyuncs.com/googlechrome-mac.dmg');
+      }
+    }
 
     return () => (
       <div class={styles['view-account']}>
@@ -138,6 +150,15 @@ export default defineComponent({
               </NTabPane>
             </NTabs>
           )}
+
+
+         <div class={styles.alertWrap}>
+          <div class={styles.alertInfo}>
+            <NImage src={infoIcon} class={styles.infoIcon} previewDisabled></NImage>
+            为了您更好的上课体验，推荐使用Chrome浏览器
+          </div>
+          <div class={styles.down} onClick={downChrome}>立即下载</div>
+         </div>
         </div>
         <NModal
           v-model:show={showModalMask.value}

src/views/natural-resources/components/share-resources/index.module.less

@@ -5,6 +5,7 @@
   justify-content: flex-start;
   gap: 22px;
   min-height: 220px;
+  overflow-y: auto;
 }
 
 .searchGroup {

src/views/prepare-lessons/index.tsx

@@ -16,8 +16,9 @@ export default defineComponent({
     console.log(prepareStore, 'prepareStore');
     const { treeList, coursewareList } = storeToRefs(prepareStore);
     const showGuide = computed(() => {
-      return treeList.value.length > 0 && coursewareList.value.length > 0;
+      return treeList.value.length > 0 && coursewareList.value.length > 0 && isEndMounted.value;
     });
+    const isEndMounted = ref(false)
     const directroyRef = ref();
     onMounted(() => {
       useResizeObserver(
@@ -31,6 +32,7 @@ export default defineComponent({
           );
         }
       );
+      isEndMounted.value = true
     });
 
     // 当前页面离开时