Merge branch 'iteration-20240513-text' into jenkins-dev

src/components/RouterError/index.tsx

@@ -32,7 +32,7 @@ const isChromeError = (error: any) => {
     if (!refreshing && !error.message && !notIncoudle.includes(tagName)) {
       refreshing = true;
       sessionStorage.setItem('isRouter', 'true');
-      reloadPage();
+      // reloadPage();
     }
   }, 500);
 };

src/components/card-preview/song-modal/index.tsx

@@ -1,239 +1,239 @@
-import { defineComponent, reactive, ref, nextTick } from 'vue';
-import styles from './index.module.less';
-import iconplay from '@views/attend-class/image/icon-pause.png';
-import iconpause from '@views/attend-class/image/icon-play.png';
-import iconReplay from '@views/attend-class/image/icon-replay.png';
-import iconPreviewDownload from '@views/attend-class/image/icon-preivew-download.png';
-import { NSlider, useMessage } from 'naive-ui';
-import Vudio from 'vudio.js';
-import tickMp3 from '@views/attend-class/image/tick.mp3';
-import { saveAs } from 'file-saver';
-
-export default defineComponent({
-  name: 'audio-play',
-  props: {
-    item: {
-      type: Object,
-      default: () => {
-        return {};
-      }
-    },
-    isEmtry: {
-      type: Boolean,
-      default: false
-    },
-    isDownload: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup(props) {
-    const message = useMessage();
-    const audioForms = reactive({
-      paused: true,
-      currentTimeNum: 0,
-      currentTime: '00:00',
-      durationNum: 0,
-      duration: '00:00',
-      showBar: true,
-      afterMa3: true
-    });
-    const canvas: any = ref();
-    const audio: any = ref();
-    let vudio: any = null;
-
-    // 切换音频播放
-    const onToggleAudio = (e?: MouseEvent) => {
-      e?.stopPropagation();
-      if (audio.value.paused) {
-        onInit(audio.value, canvas.value);
-        audio.value.play();
-        audioForms.afterMa3 = false;
-      } else {
-        audio.value.pause();
-      }
-      audioForms.paused = audio.value.paused;
-    };
-
-    const onInit = (audio: undefined, canvas: undefined) => {
-      if (!vudio) {
-        vudio = new Vudio(audio, canvas, {
-          effect: 'waveform',
-          accuracy: 256,
-          width: 1024,
-          height: 600,
-          waveform: {
-            maxHeight: 200,
-            color: [
-              [0, '#44D1FF'],
-              [0.5, '#44D1FF'],
-              [0.5, '#198CFE'],
-              [1, '#198CFE']
-            ],
-            prettify: false
-          }
-        });
-        vudio.dance();
-      }
-    };
-
-    // 对时间进行格式化
-    const timeFormat = (num: number) => {
-      if (num > 0) {
-        const m = Math.floor(num / 60);
-        const s = num % 60;
-        return (m < 10 ? '0' + m : m) + ':' + (s < 10 ? '0' + s : s);
-      } else {
-        return '00:00';
-      }
-    };
-
-    const onReplay = () => {
-      if (!audio.value) return;
-      audio.value.currentTime = 0;
-
-      console.log(props.item);
-    };
-
-    // 下载资源
-    const onDownload = () => {
-      if (!props.item.content) {
-        message.error('下载失败');
-        return;
-      }
-      const fileUrl = props.item.content;
-      const filename = props.item.title;
-      // 发起Fetch请求
-      fetch(fileUrl)
-        .then(response => response.blob())
-        .then(blob => {
-          saveAs(blob, filename || new Date().getTime() + '.mp3');
-        })
-        .catch(() => {
-          message.error('下载失败');
-        });
-    };
-
-    let vudio1 = null;
-    const canvas1: any = ref();
-    const audio1: any = ref();
-    nextTick(() => {
-      vudio1 = new Vudio(audio1.value, canvas1.value, {
-        effect: 'waveform',
-        accuracy: 256,
-        width: 1024,
-        height: 600,
-        waveform: {
-          maxHeight: 200,
-          color: [
-            [0, '#44D1FF'],
-            [0.5, '#44D1FF'],
-            [0.5, '#198CFE'],
-            [1, '#198CFE']
-          ],
-          prettify: false
-        }
-      });
-      vudio1.dance();
-    });
-
-    return () => (
-      <div class={styles.audioWrap}>
-        <div class={styles.audioContainer}>
-          <audio
-            ref={audio}
-            crossorigin="anonymous"
-            src={props.item.content + '?time=1'}
-            onEnded={() => {
-              audioForms.paused = true;
-            }}
-            onTimeupdate={() => {
-              audioForms.currentTime = timeFormat(
-                Math.floor(audio.value?.currentTime || 0)
-              );
-              audioForms.currentTimeNum = audio.value.currentTime;
-            }}
-            onLoadedmetadata={() => {
-              audioForms.duration = timeFormat(
-                Math.floor(audio.value.duration)
-              );
-              audioForms.durationNum = audio.value.duration;
-            }}></audio>
-
-          <canvas ref={canvas}></canvas>
-
-          {audioForms.afterMa3 && (
-            <div class={styles.tempVudio}>
-              <audio ref={audio1} src={tickMp3} />
-              <canvas ref={canvas1}></canvas>
-            </div>
-          )}
-        </div>
-
-        <div
-          class={[
-            styles.controls,
-            audioForms.showBar ? '' : styles.sectionAnimate
-          ]}
-          onClick={(e: MouseEvent) => {
-            e.stopPropagation();
-          }}>
-          <div class={styles.actions}>
-            <div class={styles.actionWrap}>
-              <button class={styles.actionBtn} onClick={onToggleAudio}>
-                {audioForms.paused ? (
-                  <img class={styles.playIcon} src={iconplay} />
-                ) : (
-                  <img class={styles.playIcon} src={iconpause} />
-                )}
-              </button>
-              <button class={styles.iconReplay} onClick={onReplay}>
-                <img src={iconReplay} />
-              </button>
-            </div>
-          </div>
-
-          <div class={styles.slider}>
-            <NSlider
-              value={audioForms.currentTimeNum}
-              step={0.01}
-              max={audioForms.durationNum}
-              tooltip={false}
-              onUpdate:value={(val: number) => {
-                audio.value.currentTime = val;
-                audioForms.currentTimeNum = val;
-                audioForms.currentTime = timeFormat(Math.round(val || 0));
-              }}
-            />
-          </div>
-
-          <div class={styles.actions}>
-            <div class={styles.time}>
-              <div
-                class="plyr__time plyr__time--current"
-                aria-label="Current time">
-                {audioForms.currentTime}
-              </div>
-              <span class={styles.line}>/</span>
-              <div
-                class="plyr__time plyr__time--duration"
-                aria-label="Duration">
-                {audioForms.duration}
-              </div>
-            </div>
-            <div class={styles.actionWrap}>
-              {props.isDownload && (
-                <button
-                  class={styles.iconReplay}
-                  onClick={onDownload}
-                  style={{ marginLeft: '15px' }}>
-                  <img src={iconPreviewDownload} />
-                </button>
-              )}
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  }
-});
+import { defineComponent, reactive, ref, nextTick } from 'vue';
+import styles from './index.module.less';
+import iconplay from '@views/attend-class/image/icon-pause.png';
+import iconpause from '@views/attend-class/image/icon-play.png';
+import iconReplay from '@views/attend-class/image/icon-replay.png';
+import iconPreviewDownload from '@views/attend-class/image/icon-preivew-download.png';
+import { NSlider, useMessage } from 'naive-ui';
+import Vudio from 'vudio.js';
+import tickMp3 from '@views/attend-class/image/tick.mp3';
+import { saveAs } from 'file-saver';
+
+export default defineComponent({
+  name: 'audio-play',
+  props: {
+    item: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    isEmtry: {
+      type: Boolean,
+      default: false
+    },
+    isDownload: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    const message = useMessage();
+    const audioForms = reactive({
+      paused: true,
+      currentTimeNum: 0,
+      currentTime: '00:00',
+      durationNum: 0,
+      duration: '00:00',
+      showBar: true,
+      afterMa3: true
+    });
+    const canvas: any = ref();
+    const audio: any = ref();
+    let vudio: any = null;
+
+    // 切换音频播放
+    const onToggleAudio = (e?: MouseEvent) => {
+      e?.stopPropagation();
+      if (audio.value.paused) {
+        onInit(audio.value, canvas.value);
+        audio.value.play();
+        audioForms.afterMa3 = false;
+      } else {
+        audio.value.pause();
+      }
+      audioForms.paused = audio.value.paused;
+    };
+
+    const onInit = (audio: undefined, canvas: undefined) => {
+      if (!vudio) {
+        vudio = new Vudio(audio, canvas, {
+          effect: 'waveform',
+          accuracy: 256,
+          width: 1024,
+          height: 600,
+          waveform: {
+            maxHeight: 200,
+            color: [
+              [0, '#44D1FF'],
+              [0.5, '#44D1FF'],
+              [0.5, '#198CFE'],
+              [1, '#198CFE']
+            ],
+            prettify: false
+          }
+        });
+        vudio.dance();
+      }
+    };
+
+    // 对时间进行格式化
+    const timeFormat = (num: number) => {
+      if (num > 0) {
+        const m = Math.floor(num / 60);
+        const s = num % 60;
+        return (m < 10 ? '0' + m : m) + ':' + (s < 10 ? '0' + s : s);
+      } else {
+        return '00:00';
+      }
+    };
+
+    const onReplay = () => {
+      if (!audio.value) return;
+      audio.value.currentTime = 0;
+
+      console.log(props.item);
+    };
+
+    // 下载资源
+    const onDownload = () => {
+      if (!props.item.content) {
+        message.error('下载失败');
+        return;
+      }
+      const fileUrl = props.item.content;
+      const filename = props.item.title;
+      // 发起Fetch请求
+      fetch(fileUrl)
+        .then(response => response.blob())
+        .then(blob => {
+          saveAs(blob, filename || new Date().getTime() + '.mp3');
+        })
+        .catch(() => {
+          message.error('下载失败');
+        });
+    };
+
+    let vudio1 = null;
+    const canvas1: any = ref();
+    const audio1: any = ref();
+    nextTick(() => {
+      vudio1 = new Vudio(audio1.value, canvas1.value, {
+        effect: 'waveform',
+        accuracy: 256,
+        width: 1024,
+        height: 600,
+        waveform: {
+          maxHeight: 200,
+          color: [
+            [0, '#44D1FF'],
+            [0.5, '#44D1FF'],
+            [0.5, '#198CFE'],
+            [1, '#198CFE']
+          ],
+          prettify: false
+        }
+      });
+      vudio1.dance();
+    });
+
+    return () => (
+      <div class={styles.audioWrap}>
+        <div class={styles.audioContainer}>
+          <audio
+            ref={audio}
+            crossorigin="anonymous"
+            src={props.item.content + '?time=1'}
+            onEnded={() => {
+              audioForms.paused = true;
+            }}
+            onTimeupdate={() => {
+              audioForms.currentTime = timeFormat(
+                Math.floor(audio.value?.currentTime || 0)
+              );
+              audioForms.currentTimeNum = audio.value?.currentTime || 0;
+            }}
+            onLoadedmetadata={() => {
+              audioForms.duration = timeFormat(
+                Math.floor(audio.value?.duration)
+              );
+              audioForms.durationNum = audio.value?.duration;
+            }}></audio>
+
+          <canvas ref={canvas}></canvas>
+
+          {audioForms.afterMa3 && (
+            <div class={styles.tempVudio}>
+              <audio ref={audio1} src={tickMp3} />
+              <canvas ref={canvas1}></canvas>
+            </div>
+          )}
+        </div>
+
+        <div
+          class={[
+            styles.controls,
+            audioForms.showBar ? '' : styles.sectionAnimate
+          ]}
+          onClick={(e: MouseEvent) => {
+            e.stopPropagation();
+          }}>
+          <div class={styles.actions}>
+            <div class={styles.actionWrap}>
+              <button class={styles.actionBtn} onClick={onToggleAudio}>
+                {audioForms.paused ? (
+                  <img class={styles.playIcon} src={iconplay} />
+                ) : (
+                  <img class={styles.playIcon} src={iconpause} />
+                )}
+              </button>
+              <button class={styles.iconReplay} onClick={onReplay}>
+                <img src={iconReplay} />
+              </button>
+            </div>
+          </div>
+
+          <div class={styles.slider}>
+            <NSlider
+              value={audioForms.currentTimeNum}
+              step={0.01}
+              max={audioForms.durationNum}
+              tooltip={false}
+              onUpdate:value={(val: number) => {
+                audio.value.currentTime = val;
+                audioForms.currentTimeNum = val;
+                audioForms.currentTime = timeFormat(Math.round(val || 0));
+              }}
+            />
+          </div>
+
+          <div class={styles.actions}>
+            <div class={styles.time}>
+              <div
+                class="plyr__time plyr__time--current"
+                aria-label="Current time">
+                {audioForms.currentTime}
+              </div>
+              <span class={styles.line}>/</span>
+              <div
+                class="plyr__time plyr__time--duration"
+                aria-label="Duration">
+                {audioForms.duration}
+              </div>
+            </div>
+            <div class={styles.actionWrap}>
+              {props.isDownload && (
+                <button
+                  class={styles.iconReplay}
+                  onClick={onDownload}
+                  style={{ marginLeft: '15px' }}>
+                  <img src={iconPreviewDownload} />
+                </button>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+});

src/views/classList/work-item/index.tsx

@@ -65,7 +65,7 @@ export default defineComponent({
           {props.item.fileList?.fileType === 'SOUND' && (
             <div
               onClick={() => {
-                preivewItem.value.content = props.item.fileList?.content;
+                preivewItem.value.content = props.item.fileList?.filePath;
                 preivewItem.value.title = props.item.musicName;
                 preivewItem.value.type = 'SONG';
                 previewShow.value = true;

vite.config.ts

@@ -1,172 +1,174 @@
-import { defineConfig } from 'vite';
-import vue from '@vitejs/plugin-vue';
-import vueJsx from '@vitejs/plugin-vue-jsx';
-
-import Components from 'unplugin-vue-components/vite';
-import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
-// import viteESLint from 'vite-plugin-eslint';
-import legacyPlugin from '@vitejs/plugin-legacy';
-import { VitePWA } from 'vite-plugin-pwa';
-// 引入等比适配插件
-import px2rem from 'postcss-px2rem';
-import versionUpdatePlugin from './src/plugins/version';
-// 配置基本大小
-const postcss = px2rem({
-  // 基准大小 baseSize，需要和rem.js中相同
-  remUnit: 16
-});
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const path = require('path');
-
-function resolve(dir: string) {
-  return path.join(__dirname, dir);
-}
-// https://vitejs.dev/config/
-// https://github.com/vitejs/vite/issues/1930 .env
-const proxyUrl = 'https://dev.kt.colexiu.com/';
-// const proxyUrl = 'https://test.kt.colexiu.com';
-// const proxyUrl = 'http://192.168.3.14:7989';
-const now = new Date().getTime();
-export default defineConfig(() => {
-  return {
-    base: './',
-    plugins: [
-      vue(),
-      vueJsx(),
-      // viteESLint(),
-      Components({
-        dts: true,
-        resolvers: [NaiveUiResolver()]
-      }),
-      legacyPlugin({
-        targets: ['defaults', 'not IE 11'],
-        additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
-        renderLegacyChunks: true,
-        polyfills: [
-          'es.symbol',
-          'es.promise',
-          'es.promise.finally',
-          'es/map',
-          'es/set',
-          'es.array.filter',
-          'es.array.for-each',
-          'es.array.flat-map',
-          'es.object.define-properties',
-          'es.object.define-property',
-          'es.object.get-own-property-descriptor',
-          'es.object.get-own-property-descriptors',
-          'es.object.keys',
-          'es.object.to-string',
-          'web.dom-collections.for-each',
-          'esnext.global-this',
-          'esnext.string.match-all'
-        ]
-      }),
-      VitePWA({
-        registerType: 'autoUpdate',
-        includeAssets: ['./logo.png'],
-        workbox: {
-          skipWaiting: true
-          // runtimeCaching: [
-          //   {
-          //     urlPattern: /(.*?)\.(js|css|ts|tsx|html)/, // js /css /ts静态资源缓存
-          //     handler: 'NetworkOnly',
-          //     options: {
-          //       cacheName: 'js-css-cache'
-          //     }
-          //   },
-          //   {
-          //     urlPattern: /.*\.html.*/,
-          //     handler: 'NetworkOnly',
-          //     options: {
-          //       cacheName: 'wisbayar-html',
-          //       expiration: {
-          //         maxEntries: 20,
-          //         maxAgeSeconds: 30 * 24 * 60 * 60
-          //       },
-          //       cacheableResponse: {
-          //         statuses: [200]
-          //       }
-          //     }
-          //   }
-          // ]
-        },
-        manifest: {
-          name: '酷乐秀-音乐数字课堂',
-          short_name: '音乐数字课堂',
-          theme_color: '#E8EAED',
-          display: 'fullscreen',
-          icons: [
-            {
-              src: './logo.png',
-              sizes: '192x192',
-              type: 'image/png'
-            },
-            {
-              src: './logo.png',
-              sizes: '512x512',
-              type: 'image/png'
-            },
-            {
-              src: './logo.png',
-              sizes: '512x512',
-              type: 'image/png',
-              purpose: 'any maskable'
-            }
-          ],
-          prefer_related_applications: false,
-          related_applications: [
-            {
-              platform: 'webapp',
-              id: '1.0.0',
-              url: './manifest.webmanifest'
-            }
-          ]
-        },
-
-        devOptions: {
-          enabled: true
-        }
-      }),
-      versionUpdatePlugin({
-        version: now
-      })
-    ],
-    define: {
-      // 定义全局变量
-      __APP_VERSION__: now
-    },
-    build: {
-      target: 'es2015',
-      rollupOptions: {
-        output: {
-          entryFileNames: `[name]-[hash]-${now}.js`,
-          chunkFileNames: `[name]-[hash]-${now}.js`,
-          assetFileNames: `[name]-[hash].[ext]`
-        }
-      }
-    },
-    resolve: {
-      alias: {
-        '@': resolve('./src'),
-        '@common': resolve('./src/common'),
-        '@components': resolve('./src/components'),
-        '@store': resolve('./src/store'),
-        '@views': resolve('./src/views')
-      }
-    },
-    server: {
-      host: '0.0.0.0',
-      port: 5002,
-      strictPort: true,
-      cors: true,
-      https: false,
-      proxy: {
-        '/edu-app': {
-          target: proxyUrl,
-          changeOrigin: true
-        }
-      }
-    }
-  };
-});
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import vueJsx from '@vitejs/plugin-vue-jsx';
+
+import Components from 'unplugin-vue-components/vite';
+import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
+// import viteESLint from 'vite-plugin-eslint';
+import legacyPlugin from '@vitejs/plugin-legacy';
+import { VitePWA } from 'vite-plugin-pwa';
+// 引入等比适配插件
+import px2rem from 'postcss-px2rem';
+import versionUpdatePlugin from './src/plugins/version';
+// 配置基本大小
+const postcss = px2rem({
+  // 基准大小 baseSize，需要和rem.js中相同
+  remUnit: 16
+});
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const path = require('path');
+
+function resolve(dir: string) {
+  return path.join(__dirname, dir);
+}
+// https://vitejs.dev/config/
+// https://github.com/vitejs/vite/issues/1930 .env
+const proxyUrl = 'https://dev.kt.colexiu.com/';
+// const proxyUrl = 'https://test.kt.colexiu.com';
+// const proxyUrl = 'http://192.168.3.14:7989';
+const now = new Date().getTime();
+export default defineConfig(() => {
+  return {
+    base: './',
+    plugins: [
+      vue(),
+      vueJsx(),
+      // viteESLint(),
+      Components({
+        dts: true,
+        resolvers: [NaiveUiResolver()]
+      }),
+      legacyPlugin({
+        targets: ['defaults', 'not IE 11'],
+        additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
+        renderLegacyChunks: true,
+        polyfills: [
+          'es.symbol',
+          'es.promise',
+          'es.promise.finally',
+          'es/map',
+          'es/set',
+          'es.array.filter',
+          'es.array.for-each',
+          'es.array.flat-map',
+          'es.object.define-properties',
+          'es.object.define-property',
+          'es.object.get-own-property-descriptor',
+          'es.object.get-own-property-descriptors',
+          'es.object.keys',
+          'es.object.to-string',
+          'web.dom-collections.for-each',
+          'esnext.global-this',
+          'esnext.string.match-all'
+        ]
+      }),
+      VitePWA({
+        injectRegister: 'auto',
+        registerType: 'autoUpdate',
+        includeAssets: ['./logo.png'],
+        workbox: {
+          skipWaiting: true,
+          clientsClaim: true
+          // runtimeCaching: [
+          //   {
+          //     urlPattern: /(.*?)\.(js|css|ts|tsx|html)/, // js /css /ts静态资源缓存
+          //     handler: 'NetworkOnly',
+          //     options: {
+          //       cacheName: 'js-css-cache'
+          //     }
+          //   },
+          //   {
+          //     urlPattern: /.*\.html.*/,
+          //     handler: 'NetworkOnly',
+          //     options: {
+          //       cacheName: 'wisbayar-html',
+          //       expiration: {
+          //         maxEntries: 20,
+          //         maxAgeSeconds: 24 * 60 * 60
+          //       },
+          //       cacheableResponse: {
+          //         statuses: [200]
+          //       }
+          //     }
+          //   }
+          // ]
+        },
+        manifest: {
+          name: '酷乐秀-音乐数字课堂',
+          short_name: '音乐数字课堂',
+          theme_color: '#E8EAED',
+          display: 'fullscreen',
+          icons: [
+            {
+              src: './logo.png',
+              sizes: '192x192',
+              type: 'image/png'
+            },
+            {
+              src: './logo.png',
+              sizes: '512x512',
+              type: 'image/png'
+            },
+            {
+              src: './logo.png',
+              sizes: '512x512',
+              type: 'image/png',
+              purpose: 'any maskable'
+            }
+          ],
+          prefer_related_applications: false,
+          related_applications: [
+            {
+              platform: 'webapp',
+              id: '1.0.0',
+              url: './manifest.webmanifest'
+            }
+          ]
+        },
+
+        devOptions: {
+          enabled: true
+        }
+      }),
+      versionUpdatePlugin({
+        version: now
+      })
+    ],
+    define: {
+      // 定义全局变量
+      __APP_VERSION__: now
+    },
+    build: {
+      target: 'es2015',
+      rollupOptions: {
+        output: {
+          entryFileNames: `[name]-[hash]-${now}.js`,
+          chunkFileNames: `[name]-[hash]-${now}.js`,
+          assetFileNames: `[name]-[hash].[ext]`
+        }
+      }
+    },
+    resolve: {
+      alias: {
+        '@': resolve('./src'),
+        '@common': resolve('./src/common'),
+        '@components': resolve('./src/components'),
+        '@store': resolve('./src/store'),
+        '@views': resolve('./src/views')
+      }
+    },
+    server: {
+      host: '0.0.0.0',
+      port: 5002,
+      strictPort: true,
+      cors: true,
+      https: false,
+      proxy: {
+        '/edu-app': {
+          target: proxyUrl,
+          changeOrigin: true
+        }
+      }
+    }
+  };
+});