|
|
@@ -385,12 +385,11 @@ export default defineComponent({
|
|
|
audioPlayTypes.push("SING")
|
|
|
}
|
|
|
if (musicSheetType == 'SINGLE') {
|
|
|
- if (forms.musicSheetSoundList_YZ && forms.musicSheetSoundList_YZ.length > 0) {
|
|
|
+ if (forms.musicalInstrumentIdList) {
|
|
|
audioPlayTypes.push("PLAY")
|
|
|
}
|
|
|
forms.musicSheetSoundList_YZ.forEach((musicSheetSound: any) => {
|
|
|
- if (forms.musicalInstrumentIdList.includes(musicSheetSound.musicalInstrumentId) &&
|
|
|
- forms.multiInstrumentSelection.includes(musicSheetSound.musicalInstrumentId)) {
|
|
|
+ if (forms.musicalInstrumentIdList.includes(musicSheetSound.musicalInstrumentId)) {
|
|
|
musicSheetSoundList.push({
|
|
|
...musicSheetSound,
|
|
|
musicSheetId: props.data.id,
|
|
|
@@ -1475,17 +1474,6 @@ export default defineComponent({
|
|
|
multiple
|
|
|
maxTagCount={2}
|
|
|
onUpdateValue={async (value: any) => {
|
|
|
- state.instrumentList.forEach((instrument: any) => {
|
|
|
- // if (value.includes(instrument.value)) {
|
|
|
- // forms.musicSheetSoundList_YZ.push({
|
|
|
- // 'musicSheetId': props.data.id,
|
|
|
- // 'musicalInstrumentId': instrument.id + '',
|
|
|
- // 'musicalInstrumentName': instrument.name,
|
|
|
- // 'audioFileUrl': null,
|
|
|
- // 'audioPlayType':'PLAY'
|
|
|
- // });
|
|
|
- // }
|
|
|
- })
|
|
|
}}
|
|
|
/>
|
|
|
</NFormItemGi>
|
|
|
@@ -1511,7 +1499,7 @@ export default defineComponent({
|
|
|
accept=".mp3"
|
|
|
bucketName="cloud-coach"
|
|
|
text="点击上传伴奏文件"
|
|
|
- max={10}
|
|
|
+ max={1}
|
|
|
desc={'上传伴奏文件'}
|
|
|
onUpload:success={(file) => {
|
|
|
state.musicSheetAccompanimentUrls = [state.musicSheetAccompanimentUrls,file.url].filter(Boolean).join(',')
|
|
|
@@ -1596,231 +1584,194 @@ export default defineComponent({
|
|
|
</NFormItem>
|
|
|
</>
|
|
|
)}
|
|
|
- {/*渲染声轨*/}
|
|
|
- {/*单曲：从可用乐器数据渲染*/}
|
|
|
- {/*合奏：从xml中解析*/}
|
|
|
- {forms.musicSheetType == 'SINGLE' && (
|
|
|
- <>
|
|
|
- <NGrid cols={1}>
|
|
|
- <NFormItemGi
|
|
|
- label={'页面渲染声轨'}
|
|
|
- path="multiInstrumentSelection"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: `页面渲染声轨`,
|
|
|
- trigger: 'change',
|
|
|
- type: 'array'
|
|
|
- }
|
|
|
- ]}
|
|
|
+ <NGrid cols={1}>
|
|
|
+ <NFormItemGi
|
|
|
+ label={`${forms.musicSheetType === 'SINGLE' ? '页面渲染声轨' : '用户可切换声轨'}`}
|
|
|
+ path="multiTracksSelection"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: `请选择${
|
|
|
+ forms.musicSheetType === 'SINGLE' ? '页面渲染声轨' : '用户可切换声轨'
|
|
|
+ }`,
|
|
|
+ trigger: 'change',
|
|
|
+ type: 'array'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ <NGrid style="padding-top: 4px;">
|
|
|
+ <NGi span={24}>
|
|
|
+ <NRadioGroup
|
|
|
+ v-model:value={state.multiTracks}
|
|
|
+ onUpdateValue={(value) => {
|
|
|
+ checkMultiTracks(value)
|
|
|
+ }}
|
|
|
>
|
|
|
- <NCheckboxGroup v-model:value={forms.multiInstrumentSelection}
|
|
|
- onUpdateValue={(value: any) => {
|
|
|
- forms.multiInstrumentSelection = value
|
|
|
- }}
|
|
|
- >
|
|
|
- <NGrid yGap={2} cols={6}>
|
|
|
- {forms.musicalInstrumentIdList.map((item: any) => (
|
|
|
- <NGi>
|
|
|
- <NCheckbox value={item} label={state.instrumentIdNameMap.get(item)}/>
|
|
|
- </NGi>
|
|
|
- ))}
|
|
|
- </NGrid>
|
|
|
- </NCheckboxGroup>
|
|
|
- </NFormItemGi>
|
|
|
- </NGrid>
|
|
|
- {forms.musicSheetSoundList_YZ.map((item: any, index: any) => {
|
|
|
+ <NRadio value={'all'}>全选</NRadio>
|
|
|
+ <NRadio value={'allUncheck'}>重置</NRadio>
|
|
|
+ <NRadio value={'invert'}>反选</NRadio>
|
|
|
+ </NRadioGroup>
|
|
|
+ </NGi>
|
|
|
+ {state.partListNames && state.partListNames.length > 0 && (
|
|
|
+ <NGi span={24} style={'margin-top:5px'}>
|
|
|
+ <NFormItemGi
|
|
|
+ label=""
|
|
|
+ path="multiTracksSelection"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: false
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ <NCheckboxGroup v-model:value={forms.multiTracksSelection}>
|
|
|
+ <NGrid yGap={2} cols={4}>
|
|
|
+ {state.partListNames.map((item: any) => (
|
|
|
+ <NGi>
|
|
|
+ <NCheckbox value={item.value} label={item.label}/>
|
|
|
+ </NGi>
|
|
|
+ ))}
|
|
|
+ </NGrid>
|
|
|
+ </NCheckboxGroup>
|
|
|
+ </NFormItemGi>
|
|
|
+ </NGi>
|
|
|
+ )}
|
|
|
+ </NGrid>
|
|
|
+ </NFormItemGi>
|
|
|
+ </NGrid>
|
|
|
+
|
|
|
+ {/*单曲*/}
|
|
|
+ {forms.musicSheetType == 'SINGLE' && forms.playMode === 'MP3' && forms.musicSheetSoundList_YZ.map((item: any, index: any) => {
|
|
|
+ return (
|
|
|
+ <>
|
|
|
+ <NGrid cols={1}>
|
|
|
+ {forms.musicalInstrumentIdList.includes(item.musicalInstrumentId) && (
|
|
|
+ <NFormItemGi
|
|
|
+ span={12}
|
|
|
+ label={item.musicalInstrumentName}
|
|
|
+ path={`musicSheetSoundList_YZ[${index}].audioFileUrl`}
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: `请上传乐器演奏文件`
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ <UploadFile
|
|
|
+ desc={'乐器演奏文件'}
|
|
|
+ disabled={state.previewMode}
|
|
|
+ size={100}
|
|
|
+ v-model:fileList={item.audioFileUrl}
|
|
|
+ tips="仅支持上传.mp3格式文件"
|
|
|
+ listType="image"
|
|
|
+ accept=".mp3"
|
|
|
+ text={"点击上传MP3文件"}
|
|
|
+ bucketName="cloud-coach"
|
|
|
+ />
|
|
|
+ </NFormItemGi>
|
|
|
+ )}
|
|
|
+ </NGrid>
|
|
|
+ </>
|
|
|
+ )
|
|
|
+ })
|
|
|
+ }
|
|
|
+ {/*合奏*/}
|
|
|
+ {forms.musicSheetType == 'CONCERT' && forms.playMode === 'MP3' && forms.musicSheetSoundList_YY.length > 0 && (
|
|
|
+ <>
|
|
|
+ {forms.musicSheetSoundList_YY.map((item: any, index: number) => {
|
|
|
return (
|
|
|
<>
|
|
|
- <NGrid cols={1}>
|
|
|
- {forms.musicalInstrumentIdList.includes(item.musicalInstrumentId) && forms.multiInstrumentSelection.includes(item.musicalInstrumentId) && (
|
|
|
+ {(!containOther(item.track) ||
|
|
|
+ (item.track?.toLocaleUpperCase?.() != 'COMMON' &&
|
|
|
+ forms.multiTracksSelection.includes(item.track))) && (
|
|
|
+ <NGrid
|
|
|
+ class={styles.audioSection}
|
|
|
+ // v-show={forms.multiTracksSelection.indexOf(item.track) > -1}
|
|
|
+ >
|
|
|
<NFormItemGi
|
|
|
span={12}
|
|
|
- label={item.musicalInstrumentName}
|
|
|
- path={`musicSheetSoundList_YZ[${index}].audioFileUrl`}
|
|
|
+ label="原音"
|
|
|
+ path={`musicSheetSoundList_YY[${index}].audioFileUrl`}
|
|
|
rule={[
|
|
|
{
|
|
|
+ // required: forms.multiTracksSelection.indexOf(forms.musicSheetSoundList_YY[index].audioFileUrl) > -1,
|
|
|
required: true,
|
|
|
- message: `请上传乐器演奏文件`
|
|
|
+ message: `请上传${
|
|
|
+ item.track ? item.track + '的' : '第' + (index + 1) + '个'
|
|
|
+ }原音`
|
|
|
}
|
|
|
]}
|
|
|
>
|
|
|
<UploadFile
|
|
|
- desc={'乐器演奏文件'}
|
|
|
+ desc={'原音文件'}
|
|
|
disabled={state.previewMode}
|
|
|
size={100}
|
|
|
v-model:fileList={item.audioFileUrl}
|
|
|
tips="仅支持上传.mp3格式文件"
|
|
|
listType="image"
|
|
|
accept=".mp3"
|
|
|
- text={"点击上传MP3文件"}
|
|
|
bucketName="cloud-coach"
|
|
|
/>
|
|
|
</NFormItemGi>
|
|
|
- )}
|
|
|
- </NGrid>
|
|
|
- </>
|
|
|
- )
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- </>
|
|
|
- )}
|
|
|
-
|
|
|
- {forms.musicSheetType == 'CONCERT' && (
|
|
|
- <>
|
|
|
- <NGrid cols={1}>
|
|
|
- <NFormItemGi
|
|
|
- label={'用户可切换声轨'}
|
|
|
- path="multiTracksSelection"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: `请选择用户可切换声轨`,
|
|
|
- trigger: 'change',
|
|
|
- type: 'array'
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NGrid style="padding-top: 4px;">
|
|
|
- <NGi span={24}>
|
|
|
- <NRadioGroup
|
|
|
- v-model:value={state.multiTracks}
|
|
|
- onUpdateValue={(value) => {
|
|
|
- checkMultiTracks(value)
|
|
|
- }}
|
|
|
- >
|
|
|
- <NRadio value={'all'}>全选</NRadio>
|
|
|
- <NRadio value={'allUncheck'}>重置</NRadio>
|
|
|
- <NRadio value={'invert'}>反选</NRadio>
|
|
|
- </NRadioGroup>
|
|
|
- </NGi>
|
|
|
- {state.partListNames && state.partListNames.length > 0 && (
|
|
|
- <NGi span={24} style={'margin-top:5px'}>
|
|
|
- <NFormItemGi
|
|
|
- label=""
|
|
|
- path="multiTracksSelection"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: false
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NCheckboxGroup v-model:value={forms.multiTracksSelection}>
|
|
|
- <NGrid yGap={2} cols={4}>
|
|
|
- {state.partListNames.map((item: any) => (
|
|
|
- <NGi>
|
|
|
- <NCheckbox value={item.value} label={item.label}/>
|
|
|
- </NGi>
|
|
|
- ))}
|
|
|
- </NGrid>
|
|
|
- </NCheckboxGroup>
|
|
|
- </NFormItemGi>
|
|
|
- </NGi>
|
|
|
- )}
|
|
|
- </NGrid>
|
|
|
- </NFormItemGi>
|
|
|
- </NGrid>
|
|
|
- {/* 只有播放类型为mp3时才会有原音 */}
|
|
|
- {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))) && (
|
|
|
- <NGrid
|
|
|
- class={styles.audioSection}
|
|
|
- // v-show={forms.multiTracksSelection.indexOf(item.track) > -1}
|
|
|
+ {state.partListNames.length > 0 && (
|
|
|
+ <NFormItemGi
|
|
|
+ span={12}
|
|
|
+ label="所属轨道"
|
|
|
+ path={`musicSheetSoundList_YY[${index}].track`}
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择所属轨道'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
>
|
|
|
- <NFormItemGi
|
|
|
- span={12}
|
|
|
- label="原音"
|
|
|
- path={`musicSheetSoundList_YY[${index}].audioFileUrl`}
|
|
|
- rule={[
|
|
|
- {
|
|
|
- // required: forms.multiTracksSelection.indexOf(forms.musicSheetSoundList_YY[index].audioFileUrl) > -1,
|
|
|
- required: true,
|
|
|
- message: `请上传${
|
|
|
- item.track ? item.track + '的' : '第' + (index + 1) + '个'
|
|
|
- }原音`
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <UploadFile
|
|
|
- desc={'原音文件'}
|
|
|
- disabled={state.previewMode}
|
|
|
- size={100}
|
|
|
- v-model:fileList={item.audioFileUrl}
|
|
|
- tips="仅支持上传.mp3格式文件"
|
|
|
- listType="image"
|
|
|
- accept=".mp3"
|
|
|
- bucketName="cloud-coach"
|
|
|
- />
|
|
|
- </NFormItemGi>
|
|
|
- {state.partListNames.length > 0 && (
|
|
|
- <NFormItemGi
|
|
|
- span={12}
|
|
|
- label="所属轨道"
|
|
|
- path={`musicSheetSoundList_YY[${index}].track`}
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择所属轨道'
|
|
|
+ <NSelect
|
|
|
+ placeholder="请选择所属轨道"
|
|
|
+ value={item.track}
|
|
|
+ options={initPartsListStatus(item.track)}
|
|
|
+ onUpdateValue={(value: any) => {
|
|
|
+ const track = item.track
|
|
|
+
|
|
|
+ if (track) {
|
|
|
+ // 声轨交换
|
|
|
+ forms.musicSheetSoundList_YY.forEach((next: any) => {
|
|
|
+ if (next.track == value) {
|
|
|
+ next.track = track
|
|
|
}
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NSelect
|
|
|
- placeholder="请选择所属轨道"
|
|
|
- value={item.track}
|
|
|
- options={initPartsListStatus(item.track)}
|
|
|
- onUpdateValue={(value: any) => {
|
|
|
- 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
|
|
|
- }
|
|
|
- )
|
|
|
+ })
|
|
|
+
|
|
|
+ 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 && !forms.multiTracksSelection.includes(value)) {
|
|
|
- forms.multiTracksSelection.push(value)
|
|
|
- }
|
|
|
- item.track = value
|
|
|
- }}
|
|
|
- />
|
|
|
- </NFormItemGi>
|
|
|
- )}
|
|
|
- <NGi class={styles.btnRemove}>
|
|
|
- <NButton
|
|
|
- type="primary"
|
|
|
- text
|
|
|
- // disabled={forms.musicSheetSoundList_YY.length === 1}
|
|
|
- onClick={() => removeSys(index)}
|
|
|
- >
|
|
|
- 删除
|
|
|
- </NButton>
|
|
|
- </NGi>
|
|
|
- </NGrid>
|
|
|
+ if (value && !forms.multiTracksSelection.includes(value)) {
|
|
|
+ forms.multiTracksSelection.push(value)
|
|
|
+ }
|
|
|
+ item.track = value
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </NFormItemGi>
|
|
|
)}
|
|
|
- </>
|
|
|
- )
|
|
|
- })}
|
|
|
- </>
|
|
|
- )}
|
|
|
+ <NGi class={styles.btnRemove}>
|
|
|
+ <NButton
|
|
|
+ type="primary"
|
|
|
+ text
|
|
|
+ // disabled={forms.musicSheetSoundList_YY.length === 1}
|
|
|
+ onClick={() => removeSys(index)}
|
|
|
+ >
|
|
|
+ 删除
|
|
|
+ </NButton>
|
|
|
+ </NGi>
|
|
|
+ </NGrid>
|
|
|
+ )}
|
|
|
+ </>
|
|
|
+ )
|
|
|
+ })}
|
|
|
</>
|
|
|
)}
|
|
|
|
yuanliang