更新打包

src/components/layout/layoutTop.tsx

@@ -52,7 +52,6 @@ export default defineComponent({
                       }>
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
-                        xmlns:xlink="http://www.w3.org/1999/xlink"
                         viewBox="0 0 24 24">
                         <path
                           d="M7.38 21.01c.49.49 1.28.49 1.77 0l8.31-8.31a.996.996 0 0 0 0-1.41L9.15 2.98c-.49-.49-1.28-.49-1.77 0s-.49 1.28 0 1.77L14.62 12l-7.25 7.25c-.48.48-.48 1.28.01 1.76z"

src/enums/pageEnum.ts

@@ -3,7 +3,7 @@ export enum PageEnum {
   BASE_LOGIN = '/login',
   BASE_LOGIN_NAME = 'Login',
   //重定向
-  // REDIRECT = '/redirect',
+  REDIRECT = '/redirect',
   // REDIRECT_NAME = 'Redirect',
   // 首页
   BASE_HOME = '/home'

src/hooks/index.ts

@@ -1,3 +0,0 @@
-import { useAsync } from './use-async';
-
-export { useAsync };

src/hooks/setting/index.ts

@@ -1,34 +0,0 @@
-// import type { GlobConfig } from '/#/config';
-
-import { warn } from '@/utils/log';
-import { getAppEnvConfig } from '@/utils/env';
-
-export const useGlobSetting = (): Readonly<any> => {
-  const {
-    VITE_GLOB_APP_TITLE,
-    VITE_GLOB_API_URL,
-    VITE_GLOB_APP_SHORT_NAME,
-    VITE_GLOB_API_URL_PREFIX,
-    VITE_GLOB_UPLOAD_URL,
-    VITE_GLOB_PROD_MOCK,
-    VITE_GLOB_IMG_URL,
-  } = getAppEnvConfig();
-
-  if (!/[a-zA-Z\_]*/.test(VITE_GLOB_APP_SHORT_NAME)) {
-    warn(
-      `VITE_GLOB_APP_SHORT_NAME Variables can only be characters/underscores, please modify in the environment variables and re-running.`
-    );
-  }
-
-  // Take global configuration
-  const glob: Readonly<any> = {
-    title: VITE_GLOB_APP_TITLE,
-    apiUrl: VITE_GLOB_API_URL,
-    shortName: VITE_GLOB_APP_SHORT_NAME,
-    urlPrefix: VITE_GLOB_API_URL_PREFIX,
-    uploadUrl: VITE_GLOB_UPLOAD_URL,
-    prodMock: VITE_GLOB_PROD_MOCK,
-    imgUrl: VITE_GLOB_IMG_URL,
-  };
-  return glob as Readonly<any>;
-};

src/hooks/setting/useDesignSetting.ts

@@ -13,6 +13,6 @@ export function useDesignSetting() {
   return {
     getDarkTheme,
     getAppTheme,
-    getAppThemeList,
+    getAppThemeList
   };
 }

src/hooks/setting/useProjectSetting.ts

@@ -1,42 +0,0 @@
-import { computed } from 'vue';
-import { useProjectSettingStore } from '@/store/modules/projectSetting';
-
-export function useProjectSetting() {
-  const projectStore = useProjectSettingStore();
-
-  const getNavMode = computed(() => projectStore.navMode);
-
-  const getNavTheme = computed(() => projectStore.navTheme);
-
-  const getIsMobile = computed(() => projectStore.isMobile);
-
-  const getHeaderSetting = computed(() => projectStore.headerSetting);
-
-  const getMultiTabsSetting = computed(() => projectStore.multiTabsSetting);
-
-  const getMenuSetting = computed(() => projectStore.menuSetting);
-
-  const getCrumbsSetting = computed(() => projectStore.crumbsSetting);
-
-  const getPermissionMode = computed(() => projectStore.permissionMode);
-
-  const getShowFooter = computed(() => projectStore.showFooter);
-
-  const getIsPageAnimate = computed(() => projectStore.isPageAnimate);
-
-  const getPageAnimateType = computed(() => projectStore.pageAnimateType);
-
-  return {
-    getNavMode,
-    getNavTheme,
-    getIsMobile,
-    getHeaderSetting,
-    getMultiTabsSetting,
-    getMenuSetting,
-    getCrumbsSetting,
-    getPermissionMode,
-    getShowFooter,
-    getIsPageAnimate,
-    getPageAnimateType,
-  };
-}

src/hooks/web/usePage.ts

@@ -1,63 +1,70 @@
-import type { RouteLocationRaw, Router } from 'vue-router'
+import type { RouteLocationRaw, Router } from 'vue-router';
 
-import { PageEnum } from '@/enums/pageEnum'
-import { RedirectName } from '@/router/constant'
+import { PageEnum } from '@/enums/pageEnum';
+// import { RedirectName } from '@/router/constant'
 
-import { useRouter } from 'vue-router'
-import { isString } from '@/utils/is'
-import { unref } from 'vue'
+import { useRouter } from 'vue-router';
+import { isString } from '@/utils/is';
+import { unref } from 'vue';
 
-export type RouteLocationRawEx = Omit<RouteLocationRaw, 'path'> & { path: PageEnum }
+export type RouteLocationRawEx = Omit<RouteLocationRaw, 'path'> & {
+  path: PageEnum;
+};
 
 function handleError(e: Error) {
-  console.error(e)
+  console.error(e);
 }
 
 /**
  * 页面切换
  */
 export function useGo(_router?: Router) {
-  let router
+  let router;
   if (!_router) {
-    router = useRouter()
+    router = useRouter();
   }
-  const { push, replace }: any = _router || router
+  const { push, replace }: any = _router || router;
 
-  function go(opt: PageEnum | RouteLocationRawEx | string = PageEnum.BASE_HOME, isReplace = false) {
+  function go(
+    opt: PageEnum | RouteLocationRawEx | string = PageEnum.BASE_HOME,
+    isReplace = false
+  ) {
     if (!opt) {
-      return
+      return;
     }
     if (isString(opt)) {
-      isReplace ? replace(opt).catch(handleError) : push(opt).catch(handleError)
+      isReplace
+        ? replace(opt).catch(handleError)
+        : push(opt).catch(handleError);
     } else {
-      const o = opt as RouteLocationRaw
-      isReplace ? replace(o).catch(handleError) : push(o).catch(handleError)
+      const o = opt as RouteLocationRaw;
+      isReplace ? replace(o).catch(handleError) : push(o).catch(handleError);
     }
   }
-  return go
+  return go;
 }
 
 /**
  * 重做当前页面
  */
 export const useRedo = (_router?: Router) => {
-  const { push, currentRoute } = _router || useRouter()
-  const { query, params = {}, name, fullPath } = unref(currentRoute.value)
+  const { push, currentRoute } = _router || useRouter();
+  const { query, params = {}, name, fullPath } = unref(currentRoute.value);
   function redo(): Promise<boolean> {
-    return new Promise((resolve) => {
-      if (name === RedirectName) {
-        resolve(false)
-        return
-      }
-      if (name && Object.keys(params).length > 0) {
-        params['_redirect_type'] = 'name'
-        params['path'] = String(name)
-      } else {
-        params['_redirect_type'] = 'path'
-        params['path'] = fullPath
-      }
-      push({ name: RedirectName, params, query }).then(() => resolve(true))
-    })
+    return new Promise(resolve => {
+      // if (name === RedirectName) {
+      //   resolve(false)
+      //   return
+      // }
+      // if (name && Object.keys(params).length > 0) {
+      //   params['_redirect_type'] = 'name'
+      //   params['path'] = String(name)
+      // } else {
+      //   params['_redirect_type'] = 'path'
+      //   params['path'] = fullPath
+      // }
+      // push({ name: RedirectName, params, query }).then(() => resolve(true))
+    });
   }
-  return redo
-}
+  return redo;
+};

src/hooks/web/usePermission.ts

@@ -1,17 +1,18 @@
-import { useUserStore } from '@/store/modules/user';
+// import { useUserStore } from '@/store/modules/user';
 
 export function usePermission() {
-  const userStore = useUserStore();
+  // const userStore = useUserStore();
 
   /**
    * 检查权限
    * @param accesses
    */
   function _somePermissions(accesses: string[]) {
-    return userStore.getPermissions.some((item) => {
-      const { value }: any = item;
-      return accesses.includes(value);
-    });
+    // return userStore.getPermissions.some((item: any) => {
+    //   const { value }: any = item;
+    //   return accesses.includes(value);
+    // });
+    return false;
   }
 
   /**
@@ -28,11 +29,14 @@ export function usePermission() {
    * @param accesses
    */
   function hasEveryPermission(accesses: string[]): boolean {
-    const permissionsList = userStore.getPermissions;
-    if (Array.isArray(accesses)) {
-      return permissionsList.every((access: any) => accesses.includes(access.value));
-    }
-    throw new Error(`[hasEveryPermission]: ${accesses} should be a array !`);
+    // const permissionsList = userStore.getPermissions;
+    // if (Array.isArray(accesses)) {
+    //   return permissionsList.every((access: any) =>
+    //     accesses.includes(access.value)
+    //   );
+    // }
+    return false;
+    // throw new Error(`[hasEveryPermission]: ${accesses} should be a array !`);
   }
 
   /**
@@ -41,11 +45,14 @@ export function usePermission() {
    * @param accessMap
    */
   function hasSomePermission(accesses: string[]): boolean {
-    const permissionsList = userStore.getPermissions;
-    if (Array.isArray(accesses)) {
-      return permissionsList.some((access: any) => accesses.includes(access.value));
-    }
-    throw new Error(`[hasSomePermission]: ${accesses} should be a array !`);
+    // const permissionsList = userStore.getPermissions;
+    // if (Array.isArray(accesses)) {
+    //   return permissionsList.some((access: any) =>
+    //     accesses.includes(access.value)
+    //   );
+    // }
+    return false;
+    // throw new Error(`[hasSomePermission]: ${accesses} should be a array !`);
   }
 
   return { hasPermission, hasEveryPermission, hasSomePermission };

src/main.ts

@@ -1,5 +1,5 @@
 import { createApp } from 'vue';
-import App from './App.tsx';
+import App from './App';
 import router from './router/index';
 import dayjs from 'dayjs';
 import { setupNaive } from './plugins';

src/views/attend-class/component/audio-pay.tsx

@@ -3,6 +3,7 @@ import styles from './audio.module.less';
 import WaveSurfer from 'wavesurfer.js';
 import iconplay from '../image/icon-pause.svg';
 import iconpause from '../image/icon-play.svg';
+import { NSlider } from 'naive-ui';
 
 export default defineComponent({
   name: 'audio-play',
@@ -23,6 +24,7 @@ export default defineComponent({
     const audioId = 'a' + +Date.now() + Math.floor(Math.random() * 100);
     const audioForms = reactive({
       paused: true,
+      currentTimeNum: 0,
       currentTime: '00:00',
       duration: '00:00'
     });
@@ -59,8 +61,11 @@ export default defineComponent({
       });
       wavesurfer.once('ready', () => {
         audioForms.paused = audioDom.paused;
-        // console.log(audioDom.duration, wavesurfer.getDuration());
-        audioForms.duration = timeFormat(audioDom.duration);
+        audioForms.duration = timeFormat(Math.round(audioDom.duration));
+      });
+
+      wavesurfer.on('finish', () => {
+        audioForms.paused = true;
       });
     });
 
@@ -76,11 +81,14 @@ export default defineComponent({
       audioForms.paused = audioDom.paused;
     };
 
+    // 播放时监听
     audioDom.addEventListener('timeupdate', () => {
-      console.log(audioDom.currentTime);
-      audioForms.currentTime = timeFormat(Math.floor(audioDom.currentTime));
+      audioForms.currentTime = timeFormat(Math.round(audioDom.currentTime));
+      audioForms.currentTimeNum = audioDom.currentTime;
     });
 
+    // 播放结束时
+
     // 对时间进行格式化
     const timeFormat = (num: number) => {
       if (num > 0) {
@@ -95,10 +103,18 @@ export default defineComponent({
     return () => (
       <div class={styles.audioWrap}>
         <div class={styles.audioContainer}>
-          <div id={audioId}></div>
+          <div
+            id={audioId}
+            onClick={(e: MouseEvent) => {
+              e.stopPropagation();
+            }}></div>
         </div>
 
-        <div class={styles.controls}>
+        <div
+          class={styles.controls}
+          onClick={(e: MouseEvent) => {
+            e.stopPropagation();
+          }}>
           <div class={styles.actions}>
             <div class={styles.actionWrap}>
               <button class={styles.actionBtn} onClick={onToggleAudio}>
@@ -124,28 +140,13 @@ export default defineComponent({
             </div>
           </div>
 
-          <div class="${styles.slider}">
-            <div class="plyr__progress">
-              <input
-                data-plyr="seek"
-                type="range"
-                min="0"
-                max="100"
-                step="0.01"
-                value="0"
-                aria-label="Seek"
-              />
-              <progress
-                class="plyr__progress__buffer"
-                // min="0"
-                max="100"
-                value="0">
-                % buffered
-              </progress>
-              <span role="tooltip" class="plyr__tooltip">
-                00:00
-              </span>
-            </div>
+          <div class={styles.slider}>
+            <NSlider
+              v-model:value={audioForms.currentTimeNum}
+              step={0.01}
+              max={audioDom.duration}
+              tooltip={false}
+            />
           </div>
         </div>
       </div>

src/views/attend-class/component/audio.module.less

@@ -87,3 +87,16 @@
     height: 100%;
   }
 }
+
+.slider {
+  width: 100%;
+  padding: 0 20px 0 12px;
+
+  :global {
+
+    .n-slider .n-slider-rail .n-slider-rail__fill,
+    .n-slider .n-slider-handles .n-slider-handle-wrapper {
+      transition: all .2s;
+    }
+  }
+}

src/views/attend-class/component/point.module.less

@@ -1,110 +0,0 @@
-.container {
-  display: flex;
-  flex-direction: column;
-  min-width: 288px;
-  max-width: 288px;
-  height: 100vh;
-  color: #333;
-  font-size: 12px;
-  box-sizing: border-box;
-  background:#fff;
-}
-.pointHead {
-  display: flex;
-  align-items: center;
-  padding: 13px 10px 15px 15px;
-  flex-shrink: 0;
-  font-size: 14px;
-  img {
-    width: 16px;
-    height: 16px;
-    margin-right: 7px;
-  }
-}
-.content {
-  flex: 1;
-  overflow-y: auto;
-  padding: 0 20px;
-}
-.collapse {
-  &.childActive {
-    :global {
-      .van-cell {
-        color: #fff;
-      }
-    }
-    .arrow {
-      opacity: 1;
-    }
-  }
-  &:after {
-    display: none;
-    border-width: 0;
-  }
-
-  .borderTop {
-    border-top: 1px solid rgba(255, 255, 255, 0.2);
-  }
-  :global {
-    .van-cell {
-      background: transparent;
-      font-size: 14px;
-      color: rgba(255, 255, 255, 0.5);
-      padding: 6px 0;
-    }
-    .van-cell__title {
-      font-weight: 600;
-    }
-    .van-collapse-item__title--expanded {
-      color: #fff;
-    }
-    .van-collapse-item--border:after {
-      display: none;
-    }
-    .van-collapse-item__content {
-      background: transparent;
-      color: #fff;
-      font-size: 10px;
-      padding: 0 0 6px;
-    }
-  }
-  .arrow {
-    display: block;
-    width: 10px;
-    height: 10px;
-    margin-right: 6px;
-    transition: all 0.3s;
-    opacity: 0.5;
-  }
-}
-.item {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  padding: 6px 11px;
-  border-radius: 6px;
-  font-size: 12px;
-  :global {
-    .van-icon {
-      display: none;
-    }
-    .van-image {
-      margin-right: 6px;
-      margin-top: -1px;
-      width: 15px;
-      height: 16px;
-    }
-  }
-}
-.name{
-  flex: 1;
-}
-.itemActive {
-  background: #E0E0E0;
-  color: var(--van-primary);
-  :global {
-    .van-icon {
-      display: block;
-    }
-  }
-}

src/views/attend-class/component/points.tsx

@@ -1,102 +0,0 @@
-import { defineComponent, reactive, watch } from 'vue';
-import styles from './point.module.less';
-import iconMulv from '../image/icon-mulv.svg';
-import iconArrow from '../image/icon-arrow.svg';
-import iconZhibo from '../image/icon-load.gif';
-import iconImage from '../image/icon-image.svg';
-import iconImageActive from '../image/icon-image-active.svg';
-import iconVideo from '../image/icon-video.svg';
-import iconVideoActive from '../image/icon-video-active.svg';
-import iconSong from '../image/icon-song.svg';
-import iconSongActive from '../image/icon-song-active.svg';
-import { Collapse, Icon, Image } from 'vant';
-export default defineComponent({
-  name: 'points',
-  props: {
-    data: {
-      type: Array,
-      default: () => []
-    },
-    tabActive: {
-      type: String,
-      default: ''
-    },
-    itemActive: {
-      type: String,
-      default: ''
-    }
-  },
-  emits: ['handleSelect'],
-  setup(props, { emit }) {
-    const pointData = reactive({
-      active: props.tabActive[0] || '',
-      childActive: props.tabActive[1] || ''
-    });
-    watch(
-      () => props.tabActive,
-      () => {
-        pointData.active = props.tabActive[0] || '';
-        pointData.childActive = props.tabActive[1] || '';
-      }
-    );
-
-    console.log(
-      pointData.active,
-      'pointData.active',
-      props.data,
-      props.tabActive
-    );
-
-    // 获取对应图片
-    const getImage = (item: any) => {
-      if (item.type === 'VIDEO') {
-        return props.itemActive == item.id ? iconVideoActive : iconVideo;
-      } else if (['IMAGE', 'IMG'].includes(item.type)) {
-        return props.itemActive == item.id ? iconImageActive : iconImage;
-      } else if (item.type === 'SONG') {
-        return props.itemActive == item.id ? iconSongActive : iconSong;
-      } else {
-        return props.itemActive == item.id ? iconVideoActive : iconVideo;
-      }
-    };
-    return () => (
-      <div class={styles.container}>
-        <div class={styles.pointHead}>
-          <img src={iconMulv} />
-          课件列表
-        </div>
-        <div class={styles.content}>
-          <Collapse
-            class={styles.collapse}
-            modelValue={pointData.active}
-            onUpdate:modelValue={(val: any) => {
-              pointData.active = val;
-            }}
-            accordion>
-            {props.data.map((item: any, index: number) => {
-              return (
-                <div
-                  class={[
-                    styles.item,
-                    props.itemActive == item.id ? styles.itemActive : ''
-                  ]}
-                  onClick={() => {
-                    emit('handleSelect', {
-                      itemActive: item.id,
-                      tabName: item.name
-                    });
-                  }}>
-                  <Image src={getImage(item)} class={styles.itemImage} />
-                  <span class={["van-ellipsis", styles.name]}>
-                    {item.name}
-                  </span>
-                  <Icon name={iconZhibo} />
-                </div>
-              );
-            })}
-          </Collapse>
-        </div>
-      </div>
-    );
-  }
-});

src/views/attend-class/component/tool.tsx

@@ -1,4 +1,4 @@
-import { Grid, GridItem } from 'vant';
+// import { Grid, GridItem } from 'vant';
 import { defineComponent } from 'vue';
 import styles from './tool.module.less';
 import iconPen from '../image/icon-pen.png';
@@ -25,14 +25,14 @@ export default defineComponent({
     return () => (
       <div class={styles.tool}>
         <div class={styles.title}>教学功能</div>
-        <Grid class={styles.grid} columnNum={3} border={false}>
+        {/* <Grid class={styles.grid} columnNum={3} border={false}>
           {tool.map(item => (
             <GridItem
               icon={item.icon}
               text={item.name}
               onClick={() => emit('handleTool', item)}></GridItem>
           ))}
-        </Grid>
+        </Grid> */}
       </div>
     );
   }

src/views/home/index.tsx

@@ -89,10 +89,7 @@ export default defineComponent({
               <div class={styles.bannerBtn}>
                 立即处理{' '}
                 <NIcon class={styles.rotueRight}>
-                  <svg
-                    xmlns="http://www.w3.org/2000/svg"
-                    xmlns:xlink="http://www.w3.org/1999/xlink"
-                    viewBox="0 0 24 24">
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                     <path
                       d="M7.38 21.01c.49.49 1.28.49 1.77 0l8.31-8.31a.996.996 0 0 0 0-1.41L9.15 2.98c-.49-.49-1.28-.49-1.77 0s-.49 1.28 0 1.77L14.62 12l-7.25 7.25c-.48.48-.48 1.28.01 1.76z"
                       fill="currentColor"></path>