import type {SelectOption} from 'naive-ui' import { NAlert, NButton, NCascader, NCheckbox, NCheckboxGroup, NForm, NFormItem, NFormItemGi, NGi, NGrid, NInput, NInputGroup, NInputGroupLabel, NInputNumber, NModal, NRadio, NRadioGroup, NSelect, NSpace, NSpin, useDialog, useMessage } from 'naive-ui' import {defineComponent, onMounted, PropType, reactive, ref} from 'vue' import {musicSheetCategoriesQueryTree, musicSheetDetail, musicSheetSave} from '../../api' import UploadFile from '@/components/upload-file' import styles from './index.module.less' import deepClone from '@/utils/deep.clone' import axios from 'axios' import {appKey, clientType, musicSheetSourceType} from '@/utils/constant' import {getMapValueByKey, getSelectDataFromObj} from '@/utils/objectUtil' import {musicalInstrumentPage} from '@views/system-manage/subject-manage/api' import {subjectPage} from '@views/system-manage/api' import MusicSheetOwnerDialog from '@views/music-library/music-sheet/modal/musicSheetOwnerDialog' import {sysApplicationPage} from '@views/menu-manage/api' import {filterPointCategory} from '@views/teaching-manage/unit-test' import MusicCreateImg from './music-create-img' import {TABS_ROUTES} from "@/store/mutation-types"; /** * 获取指定元素下一个Note元素 * @param ele 指定元素 * @param selectors 选择器 */ const getNextNote = (ele: any, selectors: any) => { let index = 0 const parentEle = ele.closest(selectors) let pointer = parentEle const measure = parentEle?.closest('measure') let siblingNote = null // 查找到相邻的第一个note元素 while (!siblingNote && index < (measure?.childNodes.length || 50)) { index++ if (pointer?.nextElementSibling?.tagName === 'note') { siblingNote = pointer?.nextElementSibling } pointer = pointer?.nextElementSibling } return siblingNote } export const onlyVisible = (xml: any, partIndex: any) => { if (!xml) return '' const xmlParse = new DOMParser().parseFromString(xml, 'text/xml') const partList = xmlParse.getElementsByTagName('part-list')?.[0]?.getElementsByTagName('score-part') || [] const parts = xmlParse.getElementsByTagName('part') const visiblePartInfo = partList[partIndex] if (visiblePartInfo) { const id = visiblePartInfo.getAttribute('id') Array.from(parts).forEach((part) => { if (part && part.getAttribute('id') !== id) { part.parentNode?.removeChild(part) // 不等于第一行才添加避免重复添加 } // 最后一个小节的结束线元素不在最后 调整 if (part && part.getAttribute('id') === id) { const barlines = part.getElementsByTagName('barline') const lastParent = barlines[barlines.length - 1]?.parentElement if (lastParent?.lastElementChild?.tagName !== 'barline') { const children: any[] = (lastParent?.children as any) || [] for (let el of children) { if (el.tagName === 'barline') { // 将结束线元素放到最后 lastParent?.appendChild(el) break } } } } }) Array.from(partList).forEach((part) => { if (part && part.getAttribute('id') !== id) { part.parentNode?.removeChild(part) } }) // 处理装饰音问题 const notes = xmlParse.getElementsByTagName('note') const getNextvNoteDuration = (i: any) => { let nextNote = notes[i + 1] // 可能存在多个装饰音问题,取下一个非装饰音时值 for (let index = i; index < notes.length; index++) { const note = notes[index] if (!note.getElementsByTagName('grace')?.length) { nextNote = note break } } return nextNote?.getElementsByTagName('duration')[0] } Array.from(notes).forEach((note, i) => { const graces = note.getElementsByTagName('grace') if (graces && graces.length) { note.appendChild(getNextvNoteDuration(i)?.cloneNode(true)) } }) } return new XMLSerializer().serializeToString(xmlParse) } const speedInfo = { 'rall.': 1.333333333, 'poco rit.': 1.333333333, 'rit.': 1.333333333, 'molto rit.': 1.333333333, 'molto rall': 1.333333333, molto: 1.333333333, lentando: 1.333333333, allargando: 1.333333333, morendo: 1.333333333, 'accel.': 0.8, calando: 2, 'poco accel.': 0.8, 'gradually slowing': 1.333333333, slowing: 1.333333333, slow: 1.333333333, slowly: 1.333333333, faster: 1.333333333 } /** * 按照xml进行减慢速度的计算 * @param xml 始终按照第一分谱进行减慢速度的计算 */ export function getGradualLengthByXml(xml: string) { const firstPartXml = onlyVisible(xml, 0) const xmlParse = new DOMParser().parseFromString(firstPartXml, 'text/xml') const measures = Array.from(xmlParse.querySelectorAll('measure')) const notes = Array.from(xmlParse.querySelectorAll('note')) const words = Array.from(xmlParse.querySelectorAll('words')) const metronomes = Array.from(xmlParse.querySelectorAll('metronome')) const eles = [] for (const ele of [...words, ...metronomes]) { const note = getNextNote(ele, 'direction') // console.log(ele, note) if (note) { const measure = note?.closest('measure') const measureNotes = Array.from(measure.querySelectorAll('note')) const noteInMeasureIndex = Array.from(measure.childNodes) .filter((item: any) => item.nodeName === 'note') .findIndex((item) => item === note) let allDuration = 0 let leftDuration = 0 for (let i = 0; i < measureNotes.length; i++) { const n: any = measureNotes[i] const duration = +(n.querySelector('duration')?.textContent || '0') allDuration += duration if (i < noteInMeasureIndex) { leftDuration = allDuration } } eles.push({ ele, index: notes.indexOf(note), noteInMeasureIndex, textContent: ele.textContent, measureIndex: measures.indexOf(measure), //,measure?.getAttribute('number') type: ele.tagName, allDuration, leftDuration }) } } // 结尾处手动插入一个音符节点 eles.push({ ele: notes[notes.length - 1], index: notes.length, noteInMeasureIndex: 0, textContent: '', type: 'metronome', allDuration: 1, leftDuration: 1, measureIndex: measures.length }) const gradualNotes: any[] = [] eles.sort((a, b) => a.index - b.index) const keys = Object.keys(speedInfo).map((w) => w.toLocaleLowerCase()) let isLastNoteAndNotClosed = false for (const ele of eles) { const textContent: any = ele.textContent?.toLocaleLowerCase().trim() if (ele === eles[eles.length - 1]) { if (gradualNotes[gradualNotes.length - 1]?.length === 1) { isLastNoteAndNotClosed = true } } const isKeyWork = keys.find((k) => { const ks = k.split(' ') return textContent && ks.includes(textContent) }) if ( ele.type === 'metronome' || (ele.type === 'words' && (textContent.startsWith('a tempo') || isKeyWork)) || isLastNoteAndNotClosed ) { const indexOf = gradualNotes.findIndex((item) => item.length === 1) if (indexOf > -1 && ele.index > gradualNotes[indexOf]?.[0].start) { gradualNotes[indexOf][1] = { start: ele.index, measureIndex: ele.measureIndex, noteInMeasureIndex: ele.noteInMeasureIndex, allDuration: ele.allDuration, leftDuration: ele.leftDuration, type: textContent } } } if (ele.type === 'words' && isKeyWork) { gradualNotes.push([ { start: ele.index, measureIndex: ele.measureIndex, noteInMeasureIndex: ele.noteInMeasureIndex, allDuration: ele.allDuration, leftDuration: ele.leftDuration, type: textContent } ]) } } return gradualNotes } export default defineComponent({ name: 'music-operation', props: { type: { type: String, default: 'add' }, data: { type: Object as PropType, default: () => { } }, tagList: { type: Array as PropType>, default: () => [] }, subjectList: { type: Array as PropType>, default: () => [] } // musicSheetCategories: { // type: Array as PropType>, // default: () => [] // } }, emits: ['close', 'getList'], setup(props, {slots, attrs, emit}) { const forms = reactive({ details: {} as any, // 曲目详情 graduals: {} as any, // 渐变速度 playMode: 'MP3', // 播放类型 xmlFileUrl: null, // XML midiUrl: null, // mid name: null, // 曲目名称 // musicTag: [] as any, // 曲目标签 composer: null, // 音乐人 playSpeed: null as any, // 曲谱速度 // showFingering: null as any, // 是否显示指法 // canEvaluate: null as any, // 是否评测 // notation: null as any, // 能否转和简谱 // auditVersion: null as any, // 审核版本 // sortNumber: null, // 排序 musicCover: null, // 曲谱封面 remark: null, // 曲谱描述 // musicSheetSoundList: [] as any, // 原音 musicSheetSoundList_YY: [] as any, // 演唱原音 musicSheetSoundList_YZ: [] as any, // 演奏演奏 musicSheetSoundList_all_subject: null, // 全部声部原音 // musicSheetCategoriesId: null, status: false, musicSheetType: 'CONCERT', // 曲目类型 sourceType: 'PLATFORM' as any, //来源类型/作者属性(PLATFORM: 平台; ORG: 机构; PERSON: 个人) // userId: null, // 所属人 appAuditFlag: 0, // 是否审核版本 midiFileUrl: null, // 伴奏文件 MIDI文件(保留字段) subjectIds: [] as any, // 可用声部 musicalInstrumentIdList: [] as any, //可用乐器 musicCategoryId: null, //曲目分类 musicSheetAccompanimentList: [] as any, //曲目伴奏 audioType: 'HOMEMODE', // 伴奏类型 isPlayBeat: true, // 是否播放节拍器 isUseSystemBeat: true, // 是否使用系统节拍器(0:否;1:是) isUseSingSystemBeat: true, //演唱是否使用系统节拍器(0:否;1:是) repeatedBeats: false, // 是否重复节拍时长 repeatedBeatsToSing: false, //演唱是否重复节拍时长 isPlaySingBeat: true, //是否播入演唱节拍器(0: 否 1:是) evaluationStandard: 'FREQUENCY', // 评分标准 节奏 AMPLITUDE 音准 FREQUENCY 分贝 DECIBELS multiTracksSelection: [] as any, // 声轨 musicSheetExtend: {} as any, //所属人信息 musicImg: '', // 五线谱图片 musicFirstImg: '', //首调图片 musicJianImg: '', // 简谱固定调 isEvxml: false, // 是否是evxml isShowFingering: true, // 是否显示指法 solmizationFileUrl: null, // 唱名文件 isAllSubject: false, // 适用声部 }) const state = reactive({ loading: false, previewMode: false, //是否是预览模式 tagList: [...props.tagList] as any, // 标签列表 xmlFirstSpeed: null as any, // 第一个音轨速度 partListNames: [] as any, // 所有音轨声部列表 musicSheetCategories: [] as any, musicSheetAccompanimentUrls: '' as any, musicSheetAccompanimentUrlList: [] as any, instrumentData: [], instrumentList: [] as any, instrumentIdNameMap: new Map() as any, subjectList: [] as any, showMusicSheetOwnerDialog: false, //所属人弹框 // musicSheetOwnerData: {}, //所属人信息 multiTracks: null as any, multiInstruments: null, appData: [], // 应用列表 ownerName: null as any, // 所属人名称描述 productOpen: false, // 是否打开自动生成图片 productItem: {} as any, productIfameSrc: '', isAutoSave: false, // 是否自动保存 fSongFile: null as any, // 范唱 bSongFile: null as any, // 伴唱 musicSheetSoundList: [] as any, }) const gradualData = reactive({ list: [] as any[], gradualRefs: [] as any[] }) const btnLoading = ref(false) const formsRef = ref() const message = useMessage() const dialog = useDialog() // 提交记录 const onSubmit = async () => { formsRef.value.validate(async (error: any) => { if (error) { return } // 校验合奏时声轨与乐器是否存在不匹配情况 if (forms.musicSheetType == 'CONCERT') { let set = [] as any; const {data} = await musicalInstrumentPage({page: 1, rows: 9999}) data.rows.map((row: any) => { if (row.code) { row.code.split(',').forEach((code: string) => { let temp = code.replaceAll(' ', '') set.push(temp.toLocaleLowerCase()) }) } }) let unDefinedTrack = [] as any forms.multiTracksSelection.forEach((item: any) => { if (item) { let contain = false; let code = item.trim().toLocaleLowerCase() for (let i = 0; i < set.length; i++) { if (set[i].startsWith(code) || set[i].endsWith(code)) { contain = true break } } if (!contain) { unDefinedTrack.push(item) } } }) if (unDefinedTrack.length > 0) { dialog.warning({ title: '提示', content: `声轨未配置:${unDefinedTrack.join(',')}`, positiveText: '确定', onPositiveClick: () => { }, }) return } } try { //extConfigJson: {"repeatedBeats":0,"gradualTimes":{"75":"02:38:60","77":"02:43:39"}} let audioPlayTypes = [] as any; let musicSheetSoundList = []; let musicSheetType = forms.musicSheetType; if (state.fSongFile) { musicSheetSoundList.push({ musicSheetId: props.data.id, audioFileUrl: state.fSongFile, audioPlayType: 'SING', solmizationFileUrl: forms.solmizationFileUrl }) audioPlayTypes.push("SING") } var existYzFile = false; if (musicSheetType == 'SINGLE') { if (forms.isAllSubject) { if (forms.musicSheetSoundList_all_subject) { audioPlayTypes.push("PLAY") musicSheetSoundList.push({ audioFileUrl: forms.musicSheetSoundList_all_subject, musicSheetId: props.data.id, audioPlayType: 'PLAY' }) existYzFile = true } } else { if (forms.musicSheetSoundList_YZ.length > 0 && forms.playMode == 'MP3') { audioPlayTypes.push("PLAY") forms.musicSheetSoundList_YZ.forEach((musicSheetSound: any) => { if (forms.musicalInstrumentIdList.includes(musicSheetSound.musicalInstrumentId) && musicSheetSound.audioFileUrl) { existYzFile = true musicSheetSoundList.push({ ...musicSheetSound, musicSheetId: props.data.id, }) } }) } } } else if (musicSheetType == 'CONCERT') { audioPlayTypes.push("PLAY") forms.musicSheetSoundList_YY.forEach((musicSheetSound: any) => { if (musicSheetSound.audioFileUrl && musicSheetSound.track != null) { musicSheetSoundList.push({ ...musicSheetSound, musicSheetId: props.data.id, }) existYzFile = true } }) } if (!state.fSongFile && !state.bSongFile && !existYzFile) { message.warning("请上传音频文件") return } if (state.bSongFile) { forms.musicSheetAccompanimentList.push({ musicSheetId: props.data.id, audioFileUrl: state.bSongFile, audioPlayType: 'SING' }) } // 生成图片 if (!state.isAutoSave) { state.isAutoSave = true state.productOpen = true return } const obj = { musicCategoryId: forms.musicCategoryId, musicCover: forms.musicCover, name: forms.name, appAuditFlag: forms.appAuditFlag, subjectIds: forms.isAllSubject ? "" : forms.subjectIds.join(','), remark: forms.remark, audioPlayTypes: audioPlayTypes.join(','), musicalInstrumentIds: forms.isAllSubject ? "" : forms.musicalInstrumentIdList.join(','), composer: forms.composer, musicSheetType: forms.musicSheetType, isUseSystemBeat: forms.isUseSystemBeat, isShowFingering: forms.isShowFingering, isPlayBeat: forms.isPlayBeat, multiTracksSelection: forms.multiTracksSelection.join(','), playSpeed: forms.playSpeed, playMode: forms.playMode, xmlFileUrl: forms.xmlFileUrl, musicImg: forms.musicImg, musicFirstImg: forms.musicFirstImg, musicJianImg: forms.musicJianImg, extConfigJson: JSON.stringify({ repeatedBeats: forms.repeatedBeats ? 1 : 0, gradualTimes: forms.graduals, isEvxml: forms.isEvxml ? 1 : 0, repeatedBeatsToSing: forms.repeatedBeatsToSing ? 1 : 0 }), // availableType: forms.availableType, sourceType: forms.sourceType, audioType: forms.audioType, status: forms.status, evaluationStandard: forms.evaluationStandard, musicSheetAccompanimentList: forms.musicSheetAccompanimentList, musicSheetSoundList: musicSheetSoundList, musicTag: '-1', isUseSingSystemBeat: forms.isUseSingSystemBeat, isPlaySingBeat: forms.isPlaySingBeat, isAllSubject: forms.isAllSubject, musicSheetExtend: forms.sourceType == 'PLATFORM' ? null : forms.musicSheetExtend, } if (forms.audioType == 'MIDI') { obj.musicSheetSoundList = [] } btnLoading.value = true if (props.type === 'add') { await musicSheetSave(obj) message.success('添加成功') } else if (props.type === 'edit') { await musicSheetSave({...obj, id: props.data.id}) message.success('修改成功') } emit('getList') emit('close') } catch (e) { console.log(e) } setTimeout(() => { btnLoading.value = false state.isAutoSave = false }, 100) }) } // 上传XML,初始化音轨 音轨速度 乐器、声部 const readFileInputEventAsArrayBuffer = (file: any) => { // 是否是evxml forms.isEvxml = file?.name?.includes('.evxml') ? true : false; const xmlRead = new FileReader() xmlRead.onload = (res) => { try { gradualData.list = getGradualLengthByXml(res?.target?.result as any).filter( (item: any) => item.length === 2 ) } catch (error) { } forms.musicSheetSoundList_YY = forms.musicSheetSoundList_YY.filter((item: any) => { return (!item.track || !containOther(item.track) || (item.track?.toLocaleUpperCase?.() != 'COMMON' && forms.multiTracksSelection.includes(item.track))) }) state.partListNames = getPartListNames(res?.target?.result as any) as any // parseInstrumentAndSubject(res?.target?.result as any) // 这里是如果没有当前音轨就重新写 let map = new Map() for (let i = 0; i < forms.musicSheetSoundList_YY.length; i++) { let track = forms.musicSheetSoundList_YY[i].track; if (track) { map.set(track, forms.musicSheetSoundList_YY[i]) } } let newMusicSheetSoundList = [] let tracks = [] as any for (let j = 0; j < state.partListNames.length; j++) { let track = state.partListNames[j].value; if (map.has(track)) { newMusicSheetSoundList.push(map.get(track)) } else { newMusicSheetSoundList.push({audioFileUrl: null, track: track, musicalInstrumentId: null}) } tracks.push(track) if(!forms.multiTracksSelection.includes(track)) { forms.multiTracksSelection.push(track) } } for (let i = 0; i < forms.musicSheetSoundList_YY.length; i++) { let track = forms.musicSheetSoundList_YY[i].track; if (!track || !tracks.includes(track)) { forms.musicSheetSoundList_YY[i].track = null newMusicSheetSoundList.push(forms.musicSheetSoundList_YY[i]) } } forms.musicSheetSoundList_YY = newMusicSheetSoundList forms.multiTracksSelection = forms.multiTracksSelection.filter((track: any) => { return tracks.includes(track) }) // 全选选中 state.multiTracks = 'all' // 循环添加所在音轨的原音 // for (let index = forms.musicSheetSoundList.length; index < state.partListNames.length; index++) { // const part = state.partListNames[index].value // const sysData = { // ...forms.musicSheetSoundList[0], // track: part // } // if (!sysData.speed) { // sysData.speed = state.xmlFirstSpeed // } // createSys(sysData) // } if (forms.musicSheetSoundList_YY.length == 0) { forms.musicSheetSoundList_YY.push({ audioFileUrl: '', track: '' }) } } xmlRead.readAsText(file) } const containOther = (track: any) => { for (let i = 0; i < state.partListNames.length; i++) { if (state.partListNames[i].value == track) { return true } } return false } const validSoundNum = () => { return forms.musicSheetSoundList_YY.filter((item: any) => { return (!item.track || !containOther(item.track) || (item.track?.toLocaleUpperCase?.() != 'COMMON' && forms.multiTracksSelection.includes(item.track))) }).length; } const parseInstrumentAndSubject = (xml: any) => { if (!xml) return const xmlParse = new DOMParser().parseFromString(xml, 'text/xml') // 乐器 const instrumentCodeList: any = [] const instrumentEle = xmlParse.getElementsByTagName('virtual-instrument') for (let index = 0; index < instrumentEle.length; index++) { const note = instrumentEle[index] let instrumentCode = note.getElementsByTagName('virtual-name')?.[0]?.textContent || '' instrumentCode = instrumentCode.toLocaleLowerCase().trim() if (instrumentCode && !instrumentCodeList.includes(instrumentCode)) { instrumentCodeList.push(instrumentCode) } } // 乐器支持多编码,暂不开放 // const codeIdMap = new Map() as any // state.instrumentData.forEach((data: any) => { // const codes = data.code.split(/,|,/) // codes.forEach((code: string) => { // if (codeIdMap.has(code)) { // codeIdMap.get(code).push(data.id + '') // } else { // const arr = [] as any; // arr.push(data.id + '') // codeIdMap.set(code, arr) // } // // codeIdMap.set(code, data.id + '') // }) // }) // forms.musicalInstrumentIdList = [] // instrumentCodeList.forEach((code: string) => { // if (codeIdMap.has(code)) { // codeIdMap.get(code).forEach((c: any) => { // forms.musicalInstrumentIdList.push(c) // }) // } // }) const codeIdMap = new Map() state.instrumentData.forEach((data: any) => { if (!data.disabled) { codeIdMap.set(data.code.toLocaleLowerCase().trim(), data.id + '') } }) forms.musicalInstrumentIdList = [] instrumentCodeList.forEach((code: string) => { if (codeIdMap.has(code)) { forms.musicalInstrumentIdList.push(codeIdMap.get(code)) } }) // 声部 if (forms.musicalInstrumentIdList.length > 0) { showBackSubject(forms.musicalInstrumentIdList) } } // 获取xml中所有轨道 乐器 const getPartListNames = (xml: any) => { if (!xml) return [] const xmlParse = new DOMParser().parseFromString(xml, 'text/xml') const partList: any = xmlParse.getElementsByTagName('part-list')?.[0]?.getElementsByTagName('score-part') || [] let partListNames = Array.from(partList).map((item: any) => { let part = item.getElementsByTagName('part-name')?.[0] // evxml没有分轨,需要手动设置一个默认的名称,用于上传原音 // if (forms.isEvxml) { // part = part || 'noPartName' // } // 优先解析声轨,没有就取id值 let track = '' if (part) { track = part.textContent || '' } else { let id = item.getAttribute('id') if (id) { track = id } } return { value: track.trim(), label: track.trim() } }) // 处理空数据 // if (partListNames.length === 1 && forms.details.id && !partListNames[0].value) { // partListNames[0] = { // value: forms.details.multiTracksSelection, // label: forms.details.multiTracksSelection // } // } partListNames = partListNames.filter((n: any) => n.value?.toLocaleUpperCase?.() != 'COMMON') // if (partListNames.length > 0) { // forms.musicSheetSoundList = forms.musicSheetSoundList.slice(0, partListNames.length) // } state.xmlFirstSpeed = xmlParse.getElementsByTagName('per-minute')?.[0]?.textContent || '' if (!forms.playSpeed) { if (state.xmlFirstSpeed) { forms.playSpeed = Number.parseFloat(state.xmlFirstSpeed) } else { // 速度默认给100 forms.playSpeed = 100 } } // console.log('xml声轨',partListNames,state.xmlFirstSpeed) return partListNames } // 判断选择的音轨是否在选中 const initPartsListStatus = (track: string): any => { // const _names = state.partListNames.filter( // (n: any) => n.value?.toLocaleUpperCase?.() != 'COMMON' // ) const partListNames = deepClone(state.partListNames) || [] const multiTracksSelection = forms.multiTracksSelection partListNames.forEach((item: any) => { if (multiTracksSelection.includes(item.value)) { item.disabled = true } else { item.disabled = false } // const index = forms.musicSheetSoundList.findIndex( // (ground: any) => item.value == ground.track // ) // if (index > -1 && track == item.value) { // item.disabled = false // } else { // item.disabled = true // } }) return partListNames || [] } // 反显声部 const showBackSubject = async (musicalInstrumentIdList: []) => { try { const { data } = await subjectPage({ page: 1, rows: 999, musicalInstrumentIdList: musicalInstrumentIdList }) const tempList = data.rows || [] tempList.forEach((item: any) => { forms.subjectIds.push(item.id + '') }) } catch { } } // 添加原音 const createSys = (initData?: any) => { forms.musicSheetSoundList_YY.push({ audioFileUrl: null, // 原音 track: null, // 轨道 ...initData }) } // 删除原音 const removeSys = (index: number) => { dialog.warning({ title: '提示', content: `是否确认删除此原音?`, positiveText: '确定', negativeText: '取消', onPositiveClick: async () => { const sound = forms.musicSheetSoundList_YY[index] let track = sound.track // if (!track) { // track = '' // } // if (track) { const selectIndex = forms.multiTracksSelection.indexOf(track) if (selectIndex > -1) { forms.multiTracksSelection.splice(selectIndex, 1) } else { forms.musicSheetSoundList_YY.splice(index, 1) } if (state.multiTracks == 'all' && state.partListNames.length != forms.multiTracksSelection.length) { state.multiTracks = null } } }) } const checkMultiTracks = (value: string) => { if (!value) { return } if (value === 'all') { forms.multiTracksSelection = [] state.partListNames.forEach((next: any) => { forms.multiTracksSelection.push(next.value) }) } else if (value === 'invert') { state.partListNames.forEach((next: any) => { const indexOf = forms.multiTracksSelection.indexOf(next.value) if (indexOf > -1) { forms.multiTracksSelection.splice(indexOf, 1) } else { forms.multiTracksSelection.push(next.value) } }) } else if (value === 'allUncheck') { forms.multiTracksSelection = [] } } const setOwnerName = () => { if (forms.sourceType == 'PLATFORM') { state.ownerName = '' return } if (!forms.sourceType || !forms.musicSheetExtend?.userId) { return } const appId = forms.musicSheetExtend.applicationId const app = state.appData.filter((next: any) => { return next.id == appId }) as any if (app.length > 0) { state.ownerName = app[0].appName } if (forms.sourceType == 'ORG') { state.ownerName += '-' + forms.musicSheetExtend.organizationRole } else if (forms.sourceType == 'PERSON') { state.ownerName += '-' + getMapValueByKey(forms.musicSheetExtend.clientType, new Map(Object.entries(clientType))) if (forms.musicSheetExtend.userName) { state.ownerName += '-' + forms.musicSheetExtend.userName } if (forms.musicSheetExtend.phone) { state.ownerName += '(' + forms.musicSheetExtend.phone + ')' } } } // 声轨数据兼容 const formatTrack = (track: string) => { if (!track) { return ''; } const trim = track.trim().toUpperCase(); // 导入后的脏数据兼容 if (trim == 'P1' || trim == 'NULL') { return ''; } return track.trim(); } const changeSubject = async (subjectIdList: []) => { state.instrumentList = [] if (!subjectIdList || subjectIdList.length == 0) { forms.musicalInstrumentIdList = [] return } let enableFlag = null; if (props.type === 'add') { enableFlag = true; } let tempMusicalInstrumentIdList = [] as any const {data} = await musicalInstrumentPage({page: 1, rows: 999, subjectIds: subjectIdList, enableFlag: enableFlag}); data.rows.map((item: any) => { tempMusicalInstrumentIdList.push(item.id + '') state.instrumentList.push( { label: item.name, value: item.id + '', disabled: !item.enableFlag } ) }) forms.musicalInstrumentIdList = forms.musicalInstrumentIdList.filter((item: any) => { return tempMusicalInstrumentIdList.includes(item) }) } onMounted(async () => { state.loading = true if (props.type === 'preview') { state.previewMode = true } // 获取乐器信息 { if (state.instrumentList && state.instrumentList.length > 0) { return } try { const {data} = await musicalInstrumentPage({page: 1, rows: 999}) const tempList = data.rows || [] tempList.forEach((item: any) => { item.label = item.name item.value = item.id + '' item.disabled = !item.enableFlag state.instrumentIdNameMap.set(item.id + '', item.name) forms.musicSheetSoundList_YZ.push({ 'musicSheetId': props.data.id, 'musicalInstrumentId': item.id + '', 'musicalInstrumentName': item.name, 'audioFileUrl': null, 'audioPlayType': 'PLAY' }); }) state.instrumentData = tempList // state.instrumentList = tempList } catch { } } state.subjectList = deepClone(props.subjectList) state.subjectList.forEach((subject: any) => { subject.disabled = !subject.enableFlag }) // 初始化应用 { const appKeys = Object.keys(appKey) const {data} = await sysApplicationPage({page: 1, rows: 999, parentId: 0}) const tempList = data.rows || [] const filter = tempList.filter((next: any) => { return appKeys.includes(next.appKey) }) filter.forEach((item: any) => { item.label = item.appName item.value = item.id }) state.appData = filter } // 获取分类信息 { try { const {data} = await musicSheetCategoriesQueryTree({enable: true}) state.musicSheetCategories = filterPointCategory(data, 'musicSheetCategoriesList') } catch (e) { } } if (props.type === 'edit' || props.type === 'preview') { const detail = props.data try { const {data} = await musicSheetDetail({id: detail.id}) forms.details = data forms.playMode = data.playMode forms.xmlFileUrl = data.xmlFileUrl forms.midiUrl = data.midiUrl forms.name = data.name // forms.musicTag = data.musicTag?.split(',') forms.composer = data.composer forms.playSpeed = data.playSpeed ? Number.parseFloat(data.playSpeed) : 100 // forms.showFingering = Number(data.showFingering) // forms.canEvaluate = Number(data.canEvaluate) // forms.notation = Number(data.notation) // forms.auditVersion = Number(data.auditVersion) // forms.sortNumber = data.sortNumber forms.musicCover = data.musicCover forms.remark = data.remark forms.status = data.status forms.musicSheetType = data.musicSheetType || 'SINGLE' forms.sourceType = data.sourceType forms.appAuditFlag = data.appAuditFlag ? 1 : 0 forms.midiFileUrl = data.midiFileUrl forms.isShowFingering = data.isShowFingering forms.isAllSubject = data.isAllSubject forms.isUseSingSystemBeat = data.isUseSingSystemBeat forms.isPlaySingBeat = data.isPlaySingBeat forms.subjectIds = [] if (data.subjectIds) { const subjectIds = data.subjectIds.split(',') || [] subjectIds.forEach((subjectId: any) => { if (!forms.subjectIds.includes(subjectId)) { forms.subjectIds.push(subjectId) } }) state.subjectList = state.subjectList.filter((subject: any) => { return (!subject.disabled || subjectIds.includes(subject.value)); }) } forms.musicalInstrumentIdList = data.musicalInstrumentIds ? data.musicalInstrumentIds.split(',') : [] await changeSubject(forms.subjectIds) forms.musicCategoryId = data.musicCategoryId forms.audioType = data.audioType forms.isPlayBeat = data.isPlayBeat forms.isUseSystemBeat = data.isUseSystemBeat // 获取渐变 和 是否多声部 try { const extConfigJson = data.extConfigJson ? JSON.parse(data.extConfigJson) : {} forms.graduals = extConfigJson.gradualTimes || {} forms.repeatedBeats = !!extConfigJson.repeatedBeats forms.isEvxml = !!extConfigJson.isEvxml forms.repeatedBeatsToSing = !!extConfigJson.repeatedBeatsToSing } catch (error) { } forms.evaluationStandard = data.evaluationStandard forms.musicSheetExtend = data.musicSheetExtend state.musicSheetSoundList = data.musicSheetSoundList ? data.musicSheetSoundList : [] let musicSheetAccompanimentList = data.musicSheetAccompanimentList ? data.musicSheetAccompanimentList : [] musicSheetAccompanimentList.forEach((next: any) => { let audioPlayType = next.audioPlayType; if (audioPlayType && audioPlayType == 'SING') { state.bSongFile = next.audioFileUrl; } else { state.musicSheetAccompanimentUrlList.push(next.audioFileUrl) forms.musicSheetAccompanimentList.push(next) } }) // 初始化演奏 for (let i = 0; i < state.musicSheetSoundList.length; i++) { if (state.musicSheetSoundList[i].audioPlayType == 'SING') { // 范唱 唱名 state.fSongFile = state.musicSheetSoundList[i].audioFileUrl forms.solmizationFileUrl = state.musicSheetSoundList[i].solmizationFileUrl } else { if (forms.isAllSubject) { forms.musicSheetSoundList_all_subject = state.musicSheetSoundList[i].audioFileUrl } else { // 乐器演奏原音 for (let j = 0; j < forms.musicSheetSoundList_YZ.length; j++) { let musicalInstrumentId = state.musicSheetSoundList[i].musicalInstrumentId; if (musicalInstrumentId && musicalInstrumentId == forms.musicSheetSoundList_YZ[j].musicalInstrumentId) { forms.musicSheetSoundList_YZ[j].audioFileUrl = state.musicSheetSoundList[i].audioFileUrl } } } } } setOwnerName() axios.get(data.xmlFileUrl).then((res: any) => { if (res?.data) { gradualData.list = getGradualLengthByXml(res?.data as any).filter( (item: any) => item.length === 2 ) state.partListNames = getPartListNames(res?.data as any) as any // 初始化音轨和原音 if (data.multiTracksSelection) { data.multiTracksSelection = data.multiTracksSelection.toLocaleUpperCase() } if (!data.multiTracksSelection || data.multiTracksSelection.trim() == '' || data.multiTracksSelection.trim() == 'NULL') { forms.multiTracksSelection = [''] } else { forms.multiTracksSelection = data.multiTracksSelection.split(',') } let names = state.partListNames.map((next: any) => next.label) forms.multiTracksSelection = names.filter((next: any) => forms.multiTracksSelection.includes(next.toLocaleUpperCase())) const existSoundList = data.musicSheetSoundList ? data.musicSheetSoundList : [] // 如果只有一个原音文件,并且原音没有对应声轨,取xml解析中的第一个声轨绑定当当前原音 // if (existSoundList.length === 1 && !formatTrack(existSoundList[0].track)) { // let track = state.partListNames.length > 0 ? state.partListNames[0].value : null; // forms.musicSheetSoundList_YY.push({ // audioFileUrl: existSoundList[0].audioFileUrl, // 原音 // musicalInstrumentId: existSoundList[0].musicalInstrumentId, // track: track, // 轨道 // audioPlayType: 'PLAY' // }) // if (track && !forms.multiTracksSelection.includes(track)) { // forms.multiTracksSelection.push(track) // } // } else { const tracks = [] as any state.partListNames.forEach((item: any) => { let audioFileUrl = null let musicalInstrumentId = null if (forms.musicSheetType == 'CONCERT') { existSoundList.forEach((next: any) => { if (next.audioPlayType == 'PLAY') { if (!next.track || next.track.trim() == '') { next.track = '' } if (next.track == item.value) { audioFileUrl = next.audioFileUrl musicalInstrumentId = next.musicalInstrumentId } } }) } forms.musicSheetSoundList_YY.push({ audioFileUrl: audioFileUrl, // 原音 musicalInstrumentId: musicalInstrumentId, // 乐器 track: item.value, // 轨道 audioPlayType: 'PLAY' }) tracks.push(item.value) }) if (tracks.length == forms.multiTracksSelection.length) { state.multiTracks = 'all' } // 处理没有声轨,但有原音 if (data.musicSheetType == 'CONCERT') { state.musicSheetSoundList.forEach((next: any) => { if (next.audioPlayType == 'PLAY') { if (next.track && !tracks.includes(next.track.trim()) && next.audioPlayType == 'PLAY') { forms.musicSheetSoundList_YY.push({ audioFileUrl: next.audioFileUrl, // 原音 musicalInstrumentId: next.musicalInstrumentId, track: next.track ? next.track.trim() : '', // 轨道 audioPlayType: 'PLAY' }) } } }) // } } } }) } catch (error) { } } else { // 新增只能使用启用状态的数据 state.subjectList = state.subjectList.filter((next: any) => { return next.enableFlag == true }) state.instrumentList = state.instrumentList.filter((next: any) => { return next.enableFlag == true }) } state.loading = false }) return () => (
基本信息 { // 发送变化,清理选择的所属人信息 forms.musicSheetExtend = {} state.ownerName = null // forms.musicSheetExtend.userId = null // forms.musicSheetExtend.userName = null // forms.musicSheetExtend.applicationId = null // forms.musicSheetExtend.organizationRoleId = null }} /> {forms.sourceType === 'PERSON' && ( { state.showMusicSheetOwnerDialog = true }} > {state.ownerName ? state.ownerName : '请选择所属人'} )} {forms.sourceType === 'ORG' && ( { state.showMusicSheetOwnerDialog = true }} > {state.ownerName ? state.ownerName : '请选择所属机构'} )} 曲目设置 { if (value === 'MP3') { forms.playMode = 'MP3' } else { forms.playMode = 'MIDI' } }} > MP3 {/*{forms.playMode == 'MIDI' && (MID)}*/} {forms.playMode === 'MP3' && ( 自制伴奏 普通伴奏 )} { // forms.multiTracksSelection = [] // state.partListNames = [] // forms.musicSheetSoundList_YY = [] // forms.musicalInstrumentIdList = [] // forms.subjectIds = [] }} /> 标准评测 打击乐(振幅) 节奏(分贝) 多声轨 单声轨 部分声部 全部声部 {!forms.isAllSubject && ( { await changeSubject(val) }} /> { }} /> )} { checkMultiTracks(value) }} > 全选 重置 反选 {state.partListNames && state.partListNames.length > 0 && ( { if (state.partListNames.length != val.length) { state.multiTracks = null } else { state.multiTracks = 'all' } }} > {state.partListNames.map((item: any) => ( ))} )} 演唱文件 {forms.isPlaySingBeat && ( 系统节拍器 MP3节拍器 )} { }} /> { }} /> 演奏文件 {forms.isPlayBeat && ( 系统节拍器 MP3节拍器 )} {forms.playMode === 'MP3' && ( { state.musicSheetAccompanimentUrls = [state.musicSheetAccompanimentUrls, file.url].filter(Boolean).join(',') state.musicSheetAccompanimentUrlList = state.musicSheetAccompanimentUrls?.split(',').filter(Boolean) // 清除伴奏 // forms.musicSheetAccompanimentList = forms.musicSheetAccompanimentList.filter((next: any) => { // return next.audioPlayType == 'SING' // }) forms.musicSheetAccompanimentList = [] for (let i = 0; i < state.musicSheetAccompanimentUrlList.length; i++) { forms.musicSheetAccompanimentList.push({ audioFileUrl: state.musicSheetAccompanimentUrlList[i], sortNumber: i + 1, audioPlayType: 'PLAY' }) } }} onRemove={() => { state.musicSheetAccompanimentUrlList = [] state.musicSheetAccompanimentUrls = '' }} // onReadFileInputEventAsArrayBuffer={readFileInputEventAsArrayBuffer} multiple={true} /> )} {forms.isAllSubject && forms.musicSheetType == 'SINGLE' && ( { }} /> )} {/*渐变速*/} {!!gradualData.list.length && ( <> 识别到共1处渐变速度,请输入Dorico对应小节时间信息 {gradualData.list.map((n: any, ni: number) => ( {n[0].measureIndex}小节开始
~
{n[1].measureIndex}小节结束
))}
)} {/*独奏*/} {forms.musicSheetType == 'SINGLE' && forms.playMode === 'MP3' && !forms.isAllSubject && forms.musicSheetSoundList_YZ.map((item: any, index: any) => { return ( <> {forms.musicalInstrumentIdList.includes(item.musicalInstrumentId) && ( )} ) }) } {/*合奏*/} {forms.musicSheetType == 'CONCERT' && forms.playMode === 'MP3' && forms.musicSheetSoundList_YY.length > 0 && ( <> {forms.musicSheetSoundList_YY.map((item: any, index: number) => { return ( <> {(!containOther(item.track) || (item.track?.toLocaleUpperCase?.() != 'COMMON' && forms.multiTracksSelection.includes(item.track))) && ( -1} > -1, required: false, message: `请上传${ item.track ? item.track + '的' : '第' + (index + 1) + '个' }原音` } ]} > {state.partListNames.length > 0 && ( { const track = item.track if (track) { // 声轨交换 forms.musicSheetSoundList_YY.forEach((next: any) => { if (next.track == value) { next.track = track } }) const index = forms.multiTracksSelection.indexOf(item.track) forms.multiTracksSelection.splice(index, 1) } else { forms.musicSheetSoundList_YY = forms.musicSheetSoundList_YY.filter( (next: any) => { return next.track != value } ) } if (value != null && !forms.multiTracksSelection.includes(value)) { forms.multiTracksSelection.push(value) } item.track = value if (state.partListNames.length == forms.multiTracksSelection.length) { state.multiTracks = 'all' } }} /> )} removeSys(index)} > 删除 )} ) })} )}
{props.type !== 'preview' && ( emit('close')}> 取消 onSubmit()} loading={btnLoading.value} disabled={btnLoading.value} > 确认 )} { state.showMusicSheetOwnerDialog = false }} onChoseMusicSheetOwnerData={(musicSheetOwnerData) => { forms.musicSheetExtend = { ...musicSheetOwnerData } setOwnerName() }} /> { state.isAutoSave = false }} showIcon={false} > (state.productOpen = false)} onConfirm={async (item: any) => { // 保存 try { forms.musicImg = item.musicImg forms.musicFirstImg = item.musicFirstImg forms.musicJianImg = item.musicJianImg await onSubmit() } catch (e: any) { // console.log(e, 'e') } // setTimeout(() => { // state.isAutoSave = false // }, 50) }} />
) } })