|
|
@@ -175,24 +175,16 @@ export default defineComponent({
|
|
|
})
|
|
|
|
|
|
player.value.on('ready', () => {
|
|
|
- console.log('ready, playing')
|
|
|
staffData.audioReady = true
|
|
|
nextTick(async () => {
|
|
|
// if (staffData.details.musicSheetType === 'SINGLE') {
|
|
|
// loading.value = false
|
|
|
// return
|
|
|
// }
|
|
|
+
|
|
|
await toDetail(staffData.details)
|
|
|
renderStaff()
|
|
|
})
|
|
|
- player.value.muted = true
|
|
|
- player.value.play()
|
|
|
- })
|
|
|
- player.value.on('loadedmetadata', () => {
|
|
|
- if (player.value.muted) {
|
|
|
- player.value.muted = false
|
|
|
- player.value.pause()
|
|
|
- }
|
|
|
})
|
|
|
}
|
|
|
|
|
|
@@ -294,66 +286,70 @@ export default defineComponent({
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <OSticky position="bottom" varName="--footer-height">
|
|
|
- <div class={styles.bottomStyle} style={{ background: '#fff' }}>
|
|
|
- <div
|
|
|
- class={[styles.audio, styles.collectCell]}
|
|
|
- style={{ opacity: staffData.audioReady ? 1 : 0 }}
|
|
|
- >
|
|
|
- <audio id="player" controls ref={audioRef} style={{ height: '40px' }}>
|
|
|
- <source src={staffData.details?.audioFileUrl} type="audio/mp3" />
|
|
|
- </audio>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class={styles.footers}>
|
|
|
- <div class={styles.iconGroup}>
|
|
|
+ {staffData.details.id && (
|
|
|
+ <OSticky position="bottom" varName="--footer-height">
|
|
|
+ <div class={styles.bottomStyle} style={{ background: '#fff' }}>
|
|
|
+ {staffData.details?.audioFileUrl && (
|
|
|
<div
|
|
|
- class={styles.icon}
|
|
|
- onClick={() => {
|
|
|
- if (loading.value) return
|
|
|
- downloadStatus.value = true
|
|
|
- }}
|
|
|
+ class={[styles.audio, styles.collectCell]}
|
|
|
+ style={{ opacity: staffData.audioReady ? 1 : 0 }}
|
|
|
>
|
|
|
- <img src={iconDownload} />
|
|
|
- <span>下载</span>
|
|
|
+ <audio id="player" controls ref={audioRef} style={{ height: '40px' }}>
|
|
|
+ <source src={staffData.details?.audioFileUrl} type="audio/mp3" />
|
|
|
+ </audio>
|
|
|
</div>
|
|
|
- {staffData.details?.musicSheetType === 'CONCERT' ? (
|
|
|
- <div
|
|
|
- class={styles.icon}
|
|
|
- onClick={() => {
|
|
|
- if (loading.value) return
|
|
|
- staffData.open = true
|
|
|
- }}
|
|
|
- >
|
|
|
- <img src={iconMusic} />
|
|
|
- <span>声轨</span>
|
|
|
- </div>
|
|
|
- ) : (
|
|
|
+ )}
|
|
|
+
|
|
|
+ <div class={styles.footers}>
|
|
|
+ <div class={styles.iconGroup}>
|
|
|
<div
|
|
|
class={styles.icon}
|
|
|
onClick={() => {
|
|
|
if (loading.value) return
|
|
|
- staffData.status = true
|
|
|
+ downloadStatus.value = true
|
|
|
}}
|
|
|
>
|
|
|
- <img src={iconChange} />
|
|
|
- <span>转谱</span>
|
|
|
+ <img src={iconDownload} />
|
|
|
+ <span>下载</span>
|
|
|
</div>
|
|
|
- )}
|
|
|
+ {staffData.details?.musicSheetType === 'CONCERT' ? (
|
|
|
+ <div
|
|
|
+ class={styles.icon}
|
|
|
+ onClick={() => {
|
|
|
+ if (loading.value) return
|
|
|
+ staffData.open = true
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <img src={iconMusic} />
|
|
|
+ <span>声轨</span>
|
|
|
+ </div>
|
|
|
+ ) : (
|
|
|
+ <div
|
|
|
+ class={styles.icon}
|
|
|
+ onClick={() => {
|
|
|
+ if (loading.value) return
|
|
|
+ staffData.status = true
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <img src={iconChange} />
|
|
|
+ <span>转谱</span>
|
|
|
+ </div>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+ <Button
|
|
|
+ round
|
|
|
+ block
|
|
|
+ type="primary"
|
|
|
+ disabled={loading.value}
|
|
|
+ color={'#FF8057'}
|
|
|
+ onClick={onSubmit}
|
|
|
+ >
|
|
|
+ 开始练习
|
|
|
+ </Button>
|
|
|
</div>
|
|
|
- <Button
|
|
|
- round
|
|
|
- block
|
|
|
- type="primary"
|
|
|
- disabled={loading.value}
|
|
|
- color={'#FF8057'}
|
|
|
- onClick={onSubmit}
|
|
|
- >
|
|
|
- 开始练习
|
|
|
- </Button>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </OSticky>
|
|
|
+ </OSticky>
|
|
|
+ )}
|
|
|
|
|
|
<Popup
|
|
|
v-model:show={staffData.status}
|
