|  | @@ -1,11 +1,9 @@
 | 
	
		
			
				|  |  |  import { defineComponent, onMounted, onUnmounted, reactive, Ref, ref, watch, nextTick, Transition } from 'vue'
 | 
	
		
			
				|  |  |  import MusicSheet from '/src/music-sheet'
 | 
	
		
			
				|  |  |  import store from 'store'
 | 
	
		
			
				|  |  | -// import { throttle } from 'lodash'
 | 
	
		
			
				|  |  |  import runtime, * as RuntimeUtils from '/src/pages/detail/runtime'
 | 
	
		
			
				|  |  |  import { typeById, ITypeContentItem } from '/src/constant/fingering-colexiu'
 | 
	
		
			
				|  |  |  import detailState from '/src/pages/detail/state'
 | 
	
		
			
				|  |  | -import EvaluatingTips from '/src/pages/detail/evaluating-tips'
 | 
	
		
			
				|  |  |  import { getAllNodes, getDuration } from '/src/pages/detail/helpers'
 | 
	
		
			
				|  |  |  import SettingState from '/src/pages/detail/setting-state'
 | 
	
		
			
				|  |  |  import {
 | 
	
	
		
			
				|  | @@ -45,6 +43,7 @@ import Tips from './tips'
 | 
	
		
			
				|  |  |  import AfterClassTraining from './afterClassTraining'
 | 
	
		
			
				|  |  |  import ModelWraper from './buttons/model-wraper'
 | 
	
		
			
				|  |  |  import Follow from './popups/follow'
 | 
	
		
			
				|  |  | +import UnitTest from './unitTest'
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  // json化曲谱的note信息和svg
 | 
	
		
			
				|  |  |  export const musicJSON = reactive({
 | 
	
	
		
			
				|  | @@ -63,7 +62,7 @@ export default defineComponent({
 | 
	
		
			
				|  |  |      const browserInfo = browser()
 | 
	
		
			
				|  |  |      const tipShow = ref(false)
 | 
	
		
			
				|  |  |      const route = useRoute()
 | 
	
		
			
				|  |  | -    console.log("🚀 ~ route", route.query, search)
 | 
	
		
			
				|  |  | +    // console.log("🚀 ~ route", route.query, search)
 | 
	
		
			
				|  |  |      detailState.midiPlayIniting = true
 | 
	
		
			
				|  |  |      const renderLoading = ref(true)
 | 
	
		
			
				|  |  |      const renderError = ref(false)
 | 
	
	
		
			
				|  | @@ -74,11 +73,10 @@ export default defineComponent({
 | 
	
		
			
				|  |  |      const activeType = ref<object>({})
 | 
	
		
			
				|  |  |      const fingeringDetail = ref<ITypeContentItem | object>({})
 | 
	
		
			
				|  |  |      const [detailStatus, detail] = useDetail(search.id as string)
 | 
	
		
			
				|  |  | -    const pages = new PageFormat(650, 884)
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |      /** 监听详情的获取状态,设置指法等信息 */
 | 
	
		
			
				|  |  |      watch(detailStatus, async () => {
 | 
	
		
			
				|  |  |        if (detailStatus.value === 'success' && detail.value.xmlFileUrl) {
 | 
	
		
			
				|  |  | -        pushAppMusic(detail.value)
 | 
	
		
			
				|  |  |          fingeringDetail.value = typeById[formatId(detail.value.code || '')] || {}
 | 
	
		
			
				|  |  |          const { showFingering, frozenMode, compulsionEvaluating: compulsion } = useActivity()
 | 
	
		
			
				|  |  |          const [status, width, atype] = await useFingering(showFingering.value ? detail.value.code : undefined)
 | 
	
	
		
			
				|  | @@ -87,8 +85,6 @@ export default defineComponent({
 | 
	
		
			
				|  |  |          activeType.value = atype.value as object
 | 
	
		
			
				|  |  |          detailState.frozenMode = frozenMode.value
 | 
	
		
			
				|  |  |          compulsionEvaluating.value = compulsion.value
 | 
	
		
			
				|  |  | -      }
 | 
	
		
			
				|  |  | -      if (detailStatus.value === 'success' && detail.value.xmlFileUrl) {
 | 
	
		
			
				|  |  |          const xml = await useXml(detail.value.xmlFileUrl, detail.value)
 | 
	
		
			
				|  |  |          if (!xml.value) {
 | 
	
		
			
				|  |  |            renderLoading.value = false
 | 
	
	
		
			
				|  | @@ -100,6 +96,24 @@ export default defineComponent({
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      })
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | +    onMounted(() => {
 | 
	
		
			
				|  |  | +      ;(window as any).appName = 'colexiu'
 | 
	
		
			
				|  |  | +      RuntimeUtils.event.on('settingFingeringChange', settingFingeringChange)
 | 
	
		
			
				|  |  | +      postMessage({
 | 
	
		
			
				|  |  | +        api: 'setEventTracking',
 | 
	
		
			
				|  |  | +        content: {
 | 
	
		
			
				|  |  | +          type: 'klx_xiaokuAI',
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +      })
 | 
	
		
			
				|  |  | +    })
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    onUnmounted(() => {
 | 
	
		
			
				|  |  | +      RuntimeUtils.event.off('settingFingeringChange', settingFingeringChange)
 | 
	
		
			
				|  |  | +      if (typeof runtime?.audiosInstance?.destroy === 'function') {
 | 
	
		
			
				|  |  | +        runtime.audiosInstance?.destroy()
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +    })
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |      function throttle(fn: any, delay: number) {
 | 
	
		
			
				|  |  |        let valid = true
 | 
	
		
			
				|  |  |        return function () {
 | 
	
	
		
			
				|  | @@ -125,24 +139,6 @@ export default defineComponent({
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      }, 300)
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -    onMounted(() => {
 | 
	
		
			
				|  |  | -      ;(window as any).appName = 'colexiu'
 | 
	
		
			
				|  |  | -      RuntimeUtils.event.on('settingFingeringChange', settingFingeringChange)
 | 
	
		
			
				|  |  | -      postMessage({
 | 
	
		
			
				|  |  | -        api: 'setEventTracking',
 | 
	
		
			
				|  |  | -        content: {
 | 
	
		
			
				|  |  | -          type: 'klx_xiaokuAI',
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | -    })
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -    onUnmounted(() => {
 | 
	
		
			
				|  |  | -      RuntimeUtils.event.off('settingFingeringChange', settingFingeringChange)
 | 
	
		
			
				|  |  | -      if (typeof runtime?.audiosInstance?.destroy === 'function') {
 | 
	
		
			
				|  |  | -        runtime.audiosInstance?.destroy()
 | 
	
		
			
				|  |  | -      }
 | 
	
		
			
				|  |  | -    })
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  |      useUser()
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |      useSpecialShapedScreen()
 | 
	
	
		
			
				|  | @@ -153,11 +149,10 @@ export default defineComponent({
 | 
	
		
			
				|  |  |      const isProductJson = ref(false)
 | 
	
		
			
				|  |  |      const productRef = ref()
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -    /** 当渲染完成后的回调 */
 | 
	
		
			
				|  |  | -    const onRerender = async (osmd: OpenSheetMusicDisplay) => {
 | 
	
		
			
				|  |  | +    /**结束全屏动画 */
 | 
	
		
			
				|  |  | +    const endFullLoading = () => {
 | 
	
		
			
				|  |  |        // @ts-ignore
 | 
	
		
			
				|  |  |        window.isLoading = false
 | 
	
		
			
				|  |  | -      console.log('onRerender', '渲染结束')
 | 
	
		
			
				|  |  |        postMessage({
 | 
	
		
			
				|  |  |          api: 'cloudLoading',
 | 
	
		
			
				|  |  |          content: {
 | 
	
	
		
			
				|  | @@ -165,13 +160,18 @@ export default defineComponent({
 | 
	
		
			
				|  |  |            type: 'fullscreen',
 | 
	
		
			
				|  |  |          },
 | 
	
		
			
				|  |  |        })
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    /** 当渲染完成后的回调 */
 | 
	
		
			
				|  |  | +    const onRerender = async (osmd: OpenSheetMusicDisplay) => {
 | 
	
		
			
				|  |  | +      endFullLoading()
 | 
	
		
			
				|  |  |        detailState.initRendered = true
 | 
	
		
			
				|  |  | -      // console.log('onRerender', osmd)
 | 
	
		
			
				|  |  | -      // console.log(search)
 | 
	
		
			
				|  |  |        console.time('获取数据')
 | 
	
		
			
				|  |  |        runtime.osmd = osmd
 | 
	
		
			
				|  |  |        // 设置速度
 | 
	
		
			
				|  |  | -      const saveSpeed = (store.get('speeds') || {})[search.id as string]
 | 
	
		
			
				|  |  | +      console.log(store.get('speeds22'))
 | 
	
		
			
				|  |  | +      //@ts-ignore
 | 
	
		
			
				|  |  | +      const saveSpeed = (store.get('speeds') || {})[search.id]
 | 
	
		
			
				|  |  |        const bpm = (osmd as any).bpm || osmd.Sheet.userStartTempoInBPM
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |        detailState.activeSpeed = saveSpeed || detail.value.playSpeed || bpm || 100
 | 
	
	
		
			
				|  | @@ -260,29 +260,11 @@ export default defineComponent({
 | 
	
		
			
				|  |  |        renderLoading.value = true
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |      const onRenderError = () => {
 | 
	
		
			
				|  |  | -      // @ts-ignore
 | 
	
		
			
				|  |  | -      window.isLoading = false
 | 
	
		
			
				|  |  | -      postMessage({
 | 
	
		
			
				|  |  | -        api: 'cloudLoading',
 | 
	
		
			
				|  |  | -        content: {
 | 
	
		
			
				|  |  | -          show: false,
 | 
	
		
			
				|  |  | -          type: 'fullscreen',
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | +      endFullLoading()
 | 
	
		
			
				|  |  |        renderError.value = true
 | 
	
		
			
				|  |  |        renderLoading.value = false
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -    //给app传伴奏
 | 
	
		
			
				|  |  | -    const pushAppMusic = (detail: any) => {
 | 
	
		
			
				|  |  | -      postMessage({
 | 
	
		
			
				|  |  | -        api: 'cloudAccompanyMessage',
 | 
	
		
			
				|  |  | -        content: {
 | 
	
		
			
				|  |  | -          accompanyUrl: detail.audioFileUrl || detail.metronomeUrl || detail.url || '',
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  |      return () => {
 | 
	
		
			
				|  |  |        const loading = renderLoading.value || detailStatus.value === 'loading'
 | 
	
		
			
				|  |  |        const error = renderError.value || detailStatus.value === 'error'
 | 
	
	
		
			
				|  | @@ -306,117 +288,117 @@ export default defineComponent({
 | 
	
		
			
				|  |  |              : '',
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |        return (
 | 
	
		
			
				|  |  | -        <div
 | 
	
		
			
				|  |  | -          class={[
 | 
	
		
			
				|  |  | -            styles.container,
 | 
	
		
			
				|  |  | -            SettingState.sett.eyeProtection && 'eyeProtection',
 | 
	
		
			
				|  |  | -            browserInfo.android && 'android',
 | 
	
		
			
				|  |  | -          ]}
 | 
	
		
			
				|  |  | -        >
 | 
	
		
			
				|  |  | -          <Transition name="van-slide-down">{!renderLoading.value && <Buttons class={styles.buttons} />}</Transition>
 | 
	
		
			
				|  |  | +        <>
 | 
	
		
			
				|  |  |            <div
 | 
	
		
			
				|  |  | -            id="colexiu-detail-music-sheet"
 | 
	
		
			
				|  |  | -            class={[styles.musicSheet, { evaluating: runtime.evaluatingStatus || modelType.value === 'follow' }]}
 | 
	
		
			
				|  |  | -            style={{
 | 
	
		
			
				|  |  | -              paddingLeft: detailState.isSpecialShapedScreen ? detailState.notchHeight / 2 + 'px' : 'auto',
 | 
	
		
			
				|  |  | -              paddingBottom:
 | 
	
		
			
				|  |  | -                needFingering && (fingeringDetail.value as any).height ? (fingeringDetail.value as any).height : '40px',
 | 
	
		
			
				|  |  | -              background: SettingState.sett.camera
 | 
	
		
			
				|  |  | -                ? `rgba(${SettingState.sett.eyeProtection ? '253,244,229' : '255,255,255'} ,${
 | 
	
		
			
				|  |  | -                    SettingState.sett.opacity / 100
 | 
	
		
			
				|  |  | -                  }) !important`
 | 
	
		
			
				|  |  | -                : '',
 | 
	
		
			
				|  |  | -            }}
 | 
	
		
			
				|  |  | +            class={[
 | 
	
		
			
				|  |  | +              styles.container,
 | 
	
		
			
				|  |  | +              SettingState.sett.eyeProtection && 'eyeProtection',
 | 
	
		
			
				|  |  | +              browserInfo.android && 'android',
 | 
	
		
			
				|  |  | +            ]}
 | 
	
		
			
				|  |  |            >
 | 
	
		
			
				|  |  | -            {!!detail.value.musicSheetName && (
 | 
	
		
			
				|  |  | -              <div style={{ width: !renderLoading.value ? musicSheetStyle.width : '' }} class={styles.headTitle}>
 | 
	
		
			
				|  |  | -                {detail.value.musicSheetName}
 | 
	
		
			
				|  |  | -              </div>
 | 
	
		
			
				|  |  | -            )}
 | 
	
		
			
				|  |  | -            <Skeleton class={styles.skeleton} rowWidth="80%" title loading={detailStatus.value === 'loading'} />
 | 
	
		
			
				|  |  | -            <Skeleton class={styles.skeleton} row={6} loading={renderLoading.value} />
 | 
	
		
			
				|  |  | -            {score.value && fingeringInited && (
 | 
	
		
			
				|  |  | -              <>
 | 
	
		
			
				|  |  | -                <MusicSheet
 | 
	
		
			
				|  |  | -                  ref={MusicSheetRef}
 | 
	
		
			
				|  |  | -                  style={musicSheetStyle}
 | 
	
		
			
				|  |  | -                  score={score.value}
 | 
	
		
			
				|  |  | -                  EngravingRules={
 | 
	
		
			
				|  |  | -                    search.pageType === 'multiple'
 | 
	
		
			
				|  |  | -                      ? {
 | 
	
		
			
				|  |  | -                          PageFormat: pages,
 | 
	
		
			
				|  |  | -                          DYMusicScoreType: SettingState.sett.type,
 | 
	
		
			
				|  |  | -                        }
 | 
	
		
			
				|  |  | -                      : {
 | 
	
		
			
				|  |  | -                          DYMusicScoreType: SettingState.sett.type,
 | 
	
		
			
				|  |  | -                        }
 | 
	
		
			
				|  |  | -                  }
 | 
	
		
			
				|  |  | -                  opotions={{
 | 
	
		
			
				|  |  | -                    drawTitle: false,
 | 
	
		
			
				|  |  | -                    drawComposer: true,
 | 
	
		
			
				|  |  | -                    drawLyricist: false,
 | 
	
		
			
				|  |  | -                    drawMetronomeMarks: true,
 | 
	
		
			
				|  |  | -                    drawMeasureNumbers: true,
 | 
	
		
			
				|  |  | -                    autoResize: false,
 | 
	
		
			
				|  |  | -                  }}
 | 
	
		
			
				|  |  | -                  onStartRender={onStartRender}
 | 
	
		
			
				|  |  | -                  onRenderError={onRenderError}
 | 
	
		
			
				|  |  | -                  onRerender={onRerender}
 | 
	
		
			
				|  |  | -                />
 | 
	
		
			
				|  |  | -                {needFingering && (
 | 
	
		
			
				|  |  | -                  <Fingering
 | 
	
		
			
				|  |  | -                    style={{
 | 
	
		
			
				|  |  | -                      background: SettingState.sett.camera
 | 
	
		
			
				|  |  | -                        ? `rgba(${SettingState.sett.eyeProtection ? '253,244,229' : '255,255,255'} ,${
 | 
	
		
			
				|  |  | -                            SettingState.sett.opacity / 100
 | 
	
		
			
				|  |  | -                          })`
 | 
	
		
			
				|  |  | -                        : '',
 | 
	
		
			
				|  |  | -                      boxShadow: SettingState.sett.camera ? 'none' : '',
 | 
	
		
			
				|  |  | +            <Transition name="van-slide-down">{!renderLoading.value && <Buttons class={styles.buttons} />}</Transition>
 | 
	
		
			
				|  |  | +            <div
 | 
	
		
			
				|  |  | +              id="colexiu-detail-music-sheet"
 | 
	
		
			
				|  |  | +              class={[styles.musicSheet, { evaluating: runtime.evaluatingStatus || modelType.value === 'follow' }]}
 | 
	
		
			
				|  |  | +              style={{
 | 
	
		
			
				|  |  | +                paddingLeft: detailState.isSpecialShapedScreen ? detailState.notchHeight / 2 + 'px' : 'auto',
 | 
	
		
			
				|  |  | +                paddingBottom:
 | 
	
		
			
				|  |  | +                  needFingering && (fingeringDetail.value as any).height
 | 
	
		
			
				|  |  | +                    ? (fingeringDetail.value as any).height
 | 
	
		
			
				|  |  | +                    : '40px',
 | 
	
		
			
				|  |  | +                background: SettingState.sett.camera
 | 
	
		
			
				|  |  | +                  ? `rgba(${SettingState.sett.eyeProtection ? '253,244,229' : '255,255,255'} ,${
 | 
	
		
			
				|  |  | +                      SettingState.sett.opacity / 100
 | 
	
		
			
				|  |  | +                    }) !important`
 | 
	
		
			
				|  |  | +                  : '',
 | 
	
		
			
				|  |  | +              }}
 | 
	
		
			
				|  |  | +            >
 | 
	
		
			
				|  |  | +              {!!detail.value.musicSheetName && (
 | 
	
		
			
				|  |  | +                <div style={{ width: !renderLoading.value ? musicSheetStyle.width : '' }} class={styles.headTitle}>
 | 
	
		
			
				|  |  | +                  {detail.value.musicSheetName}
 | 
	
		
			
				|  |  | +                </div>
 | 
	
		
			
				|  |  | +              )}
 | 
	
		
			
				|  |  | +              <Skeleton class={styles.skeleton} rowWidth="80%" title loading={detailStatus.value === 'loading'} />
 | 
	
		
			
				|  |  | +              <Skeleton class={styles.skeleton} row={6} loading={renderLoading.value} />
 | 
	
		
			
				|  |  | +              {score.value && fingeringInited && (
 | 
	
		
			
				|  |  | +                <>
 | 
	
		
			
				|  |  | +                  <MusicSheet
 | 
	
		
			
				|  |  | +                    ref={MusicSheetRef}
 | 
	
		
			
				|  |  | +                    style={musicSheetStyle}
 | 
	
		
			
				|  |  | +                    score={score.value}
 | 
	
		
			
				|  |  | +                    EngravingRules={{
 | 
	
		
			
				|  |  | +                      DYMusicScoreType: SettingState.sett.type,
 | 
	
		
			
				|  |  | +                    }}
 | 
	
		
			
				|  |  | +                    opotions={{
 | 
	
		
			
				|  |  | +                      drawTitle: false,
 | 
	
		
			
				|  |  | +                      drawComposer: true,
 | 
	
		
			
				|  |  | +                      drawLyricist: false,
 | 
	
		
			
				|  |  | +                      drawMetronomeMarks: true,
 | 
	
		
			
				|  |  | +                      drawMeasureNumbers: true,
 | 
	
		
			
				|  |  | +                      autoResize: false,
 | 
	
		
			
				|  |  |                      }}
 | 
	
		
			
				|  |  | -                    code={detail.value.code}
 | 
	
		
			
				|  |  | +                    onStartRender={onStartRender}
 | 
	
		
			
				|  |  | +                    onRenderError={onRenderError}
 | 
	
		
			
				|  |  | +                    onRerender={onRerender}
 | 
	
		
			
				|  |  |                    />
 | 
	
		
			
				|  |  | -                )}
 | 
	
		
			
				|  |  | -              </>
 | 
	
		
			
				|  |  | -            )}
 | 
	
		
			
				|  |  | -            {modelType.value === 'follow' && <Follow ref={followRef} />}
 | 
	
		
			
				|  |  | -          </div>
 | 
	
		
			
				|  |  | -          {!renderLoading.value && <ButtonsPlayer />}
 | 
	
		
			
				|  |  | -          {/* 节拍器弹窗 */}
 | 
	
		
			
				|  |  | -          <TickPopup score={score.value} />
 | 
	
		
			
				|  |  | -          <Permission />
 | 
	
		
			
				|  |  | -          {/* 效音 */}
 | 
	
		
			
				|  |  | -          <SoundEffect />
 | 
	
		
			
				|  |  | -          {/* 投屏帮助 */}
 | 
	
		
			
				|  |  | -          <HelperPopup />
 | 
	
		
			
				|  |  | -          {/** 曲目列表 */}
 | 
	
		
			
				|  |  | -          <MusicList />
 | 
	
		
			
				|  |  | -          {/* 保存json */}
 | 
	
		
			
				|  |  | -          <ProductJson ref={productRef} />
 | 
	
		
			
				|  |  | +                  {needFingering && (
 | 
	
		
			
				|  |  | +                    <Fingering
 | 
	
		
			
				|  |  | +                      style={{
 | 
	
		
			
				|  |  | +                        background: SettingState.sett.camera
 | 
	
		
			
				|  |  | +                          ? `rgba(${SettingState.sett.eyeProtection ? '253,244,229' : '255,255,255'} ,${
 | 
	
		
			
				|  |  | +                              SettingState.sett.opacity / 100
 | 
	
		
			
				|  |  | +                            })`
 | 
	
		
			
				|  |  | +                          : '',
 | 
	
		
			
				|  |  | +                        boxShadow: SettingState.sett.camera ? 'none' : '',
 | 
	
		
			
				|  |  | +                      }}
 | 
	
		
			
				|  |  | +                      code={detail.value.code}
 | 
	
		
			
				|  |  | +                    />
 | 
	
		
			
				|  |  | +                  )}
 | 
	
		
			
				|  |  | +                </>
 | 
	
		
			
				|  |  | +              )}
 | 
	
		
			
				|  |  | +              {modelType.value === 'follow' && <Follow ref={followRef} />}
 | 
	
		
			
				|  |  | +            </div>
 | 
	
		
			
				|  |  | +            {!renderLoading.value && <ButtonsPlayer />}
 | 
	
		
			
				|  |  | +            {/* 节拍器弹窗 */}
 | 
	
		
			
				|  |  | +            <TickPopup score={score.value} />
 | 
	
		
			
				|  |  | +            <Permission />
 | 
	
		
			
				|  |  | +            {/* 效音 */}
 | 
	
		
			
				|  |  | +            <SoundEffect />
 | 
	
		
			
				|  |  | +            {/* 投屏帮助 */}
 | 
	
		
			
				|  |  | +            <HelperPopup />
 | 
	
		
			
				|  |  | +            {/** 曲目列表 */}
 | 
	
		
			
				|  |  | +            <MusicList />
 | 
	
		
			
				|  |  | +            {/* 保存json */}
 | 
	
		
			
				|  |  | +            <ProductJson ref={productRef} />
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -          {/* 后台课后训练小节选择 */}
 | 
	
		
			
				|  |  | -          <AfterClassTraining />
 | 
	
		
			
				|  |  | +            {/* 后台课后训练小节选择 */}
 | 
	
		
			
				|  |  | +            <AfterClassTraining />
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -          {/* 模式选择 */}
 | 
	
		
			
				|  |  | -          <Transition
 | 
	
		
			
				|  |  | -            name="van-slide-up"
 | 
	
		
			
				|  |  | -            onAfterEnter={() => {
 | 
	
		
			
				|  |  | -              tipShow.value = true
 | 
	
		
			
				|  |  | -              console.log('2342')
 | 
	
		
			
				|  |  | -            }}
 | 
	
		
			
				|  |  | -          >
 | 
	
		
			
				|  |  | -            {!renderLoading.value && modelType.value == 'init' && <ModelWraper onChangeModelType={onChangeModelType} />}
 | 
	
		
			
				|  |  | -          </Transition>
 | 
	
		
			
				|  |  | +            {/* 模式选择 */}
 | 
	
		
			
				|  |  | +            <Transition
 | 
	
		
			
				|  |  | +              name="van-slide-up"
 | 
	
		
			
				|  |  | +              onAfterEnter={() => {
 | 
	
		
			
				|  |  | +                tipShow.value = true
 | 
	
		
			
				|  |  | +              }}
 | 
	
		
			
				|  |  | +            >
 | 
	
		
			
				|  |  | +              {!renderLoading.value && modelType.value == 'init' && (
 | 
	
		
			
				|  |  | +                <ModelWraper onChangeModelType={onChangeModelType} />
 | 
	
		
			
				|  |  | +              )}
 | 
	
		
			
				|  |  | +            </Transition>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -          {/* 引导 */}
 | 
	
		
			
				|  |  | -          {tipShow.value && <Tips />}
 | 
	
		
			
				|  |  | +            {/* 引导 */}
 | 
	
		
			
				|  |  | +            {tipShow.value && !error && <Tips />}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -          {/* 加载错误 */}
 | 
	
		
			
				|  |  | -          {error && (
 | 
	
		
			
				|  |  | -            <div class={styles.errorWrap}>
 | 
	
		
			
				|  |  | -              <Empty />
 | 
	
		
			
				|  |  | -            </div>
 | 
	
		
			
				|  |  | -          )}
 | 
	
		
			
				|  |  | -        </div>
 | 
	
		
			
				|  |  | +            {/* 加载错误 */}
 | 
	
		
			
				|  |  | +            {error && (
 | 
	
		
			
				|  |  | +              <div class={styles.errorWrap}>
 | 
	
		
			
				|  |  | +                <Empty />
 | 
	
		
			
				|  |  | +              </div>
 | 
	
		
			
				|  |  | +            )}
 | 
	
		
			
				|  |  | +          </div>
 | 
	
		
			
				|  |  | +          {/* 单元测验选段 */}
 | 
	
		
			
				|  |  | +          {/* {!renderLoading.value && <UnitTest />} */}
 | 
	
		
			
				|  |  | +        </>
 | 
	
		
			
				|  |  |        )
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    },
 |