Merge branch 'iteration-music-detail'

src/tenant/music/music-detail/download.tsx

@@ -45,6 +45,10 @@ export default defineComponent({
       if (image.value) {
         saveImg()
       } else {
+        console.log(
+          list.value[acitveIndex.value],
+          'list.value[acitveIndex.value]'
+        )
         const tempCanvas = await imgToCanvas(
           list.value[acitveIndex.value] as any
         )

src/tenant/music/music-detail/formatSvgToImg.ts

@@ -1,5 +1,28 @@
 import { Canvg, presets } from 'canvg'
 
+// https://gist.githubusercontent.com/n1ru4l/9c7eff52fe084d67ff15ae6b0af5f171/raw/da9fe36d72171d4e36b92aced587b48dc5182792/offscreen-canvas-polyfill.js
+if (!window.OffscreenCanvas) {
+  // @ts-ignore
+  window.OffscreenCanvas = class OffscreenCanvas {
+    canvas: HTMLCanvasElement
+    constructor(width: number, height: number) {
+      this.canvas = document.createElement('canvas')
+      this.canvas.width = width
+      this.canvas.height = height
+
+      // @ts-ignore
+      this.canvas.convertToBlob = () => {
+        return new Promise(resolve => {
+          this.canvas.toBlob(resolve)
+        })
+      }
+
+      // @ts-ignore
+      return this.canvas
+    }
+  }
+}
+
 const preset = presets.offscreen()
 const blobToBase64 = (blob: any) => {
   return new Promise((resolve, _) => {

src/tenant/music/music-detail/new-index.tsx

@@ -589,8 +589,8 @@ export default defineComponent({
     const osmdPreviewRef = ref()
     /** 渲染五线谱 */
     const renderStaff = () => {
-      staffData.iframeSrc = `${location.origin}/osmd/index.html`
-      // staffData.iframeSrc = `${location.origin}${location.pathname}osmd/index.html`
+      // staffData.iframeSrc = `${location.origin}/osmd/index.html`
+      staffData.iframeSrc = `${location.origin}${location.pathname}osmd/index.html`
       staffData.musicXml = musicDetail.value?.xmlFileUrl || ''
       staffData.partList = musicDetail.value?.background || []
       staffData.instrumentName = getInstrumentName(