|
@@ -1,15 +1,18 @@
|
|
|
-import type { SelectOption } from 'naive-ui'
|
|
|
+import type {SelectOption} from 'naive-ui'
|
|
|
import {
|
|
|
NAlert,
|
|
|
NButton,
|
|
|
NCascader,
|
|
|
NCheckbox,
|
|
|
NCheckboxGroup,
|
|
|
- NForm, NFormItem,
|
|
|
+ NForm,
|
|
|
+ NFormItem,
|
|
|
NFormItemGi,
|
|
|
NGi,
|
|
|
NGrid,
|
|
|
- NInput, NInputGroup, NInputGroupLabel,
|
|
|
+ NInput,
|
|
|
+ NInputGroup,
|
|
|
+ NInputGroupLabel,
|
|
|
NInputNumber,
|
|
|
NModal,
|
|
|
NRadio,
|
|
@@ -20,20 +23,21 @@ import {
|
|
|
useDialog,
|
|
|
useMessage
|
|
|
} from 'naive-ui'
|
|
|
-import { defineComponent, onMounted, PropType, reactive, ref } from 'vue'
|
|
|
-import { musicSheetCategoriesQueryTree, musicSheetDetail, musicSheetSave } from '../../api'
|
|
|
+import {defineComponent, nextTick, 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, musicSheetType } 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 {appKey, clientType, musicSheetSourceType, musicSheetType} 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 {sysApplicationPage} from '@views/menu-manage/api'
|
|
|
+import {filterPointCategory} from '@views/teaching-manage/unit-test'
|
|
|
import MusicCreateImg from './music-create-img'
|
|
|
+import {onUpdated} from "vue-demi";
|
|
|
|
|
|
/**
|
|
|
* 获取指定元素下一个Note元素
|
|
@@ -437,6 +441,15 @@ export default defineComponent({
|
|
|
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 parseInstrumentAndSubject = (xml: any) => {
|
|
|
if (!xml) return
|
|
|
const xmlParse = new DOMParser().parseFromString(xml, 'text/xml')
|
|
@@ -505,15 +518,23 @@ export default defineComponent({
|
|
|
// (n: any) => n.value?.toLocaleUpperCase?.() != 'COMMON'
|
|
|
// )
|
|
|
const partListNames = deepClone(state.partListNames) || []
|
|
|
+ const multiTracksSelection = forms.multiTracksSelection;
|
|
|
partListNames.forEach((item: any) => {
|
|
|
- const index = forms.musicSheetSoundList.findIndex(
|
|
|
- (ground: any) => item.value == ground.track
|
|
|
- )
|
|
|
- if (index > -1 && track == item.value) {
|
|
|
- item.disabled = false
|
|
|
- } else {
|
|
|
+ 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 || []
|
|
|
}
|
|
@@ -549,6 +570,13 @@ export default defineComponent({
|
|
|
positiveText: '确定',
|
|
|
negativeText: '取消',
|
|
|
onPositiveClick: async () => {
|
|
|
+ const sound = forms.musicSheetSoundList[index];
|
|
|
+ const track = sound.track
|
|
|
+ const selectIndex = forms.multiTracksSelection.indexOf(track)
|
|
|
+ if (selectIndex > -1) {
|
|
|
+ forms.multiTracksSelection.splice(selectIndex, 1)
|
|
|
+ }
|
|
|
+
|
|
|
forms.musicSheetSoundList.splice(index, 1)
|
|
|
}
|
|
|
})
|
|
@@ -690,7 +718,7 @@ export default defineComponent({
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
- forms.musicalInstrumentIdList = data.musicalInstrumentIds.split(',') || []
|
|
|
+ forms.musicalInstrumentIdList = data.musicalInstrumentIds ? data.musicalInstrumentIds.split(',') : []
|
|
|
forms.musicCategoryId = data.musicCategoryId
|
|
|
data.musicSheetAccompanimentList?.forEach((next: any) => {
|
|
|
state.musicSheetAccompanimentUrlList.push(next.audioFileUrl)
|
|
@@ -717,11 +745,12 @@ export default defineComponent({
|
|
|
state.partListNames = getPartListNames(res?.data as any) as any
|
|
|
|
|
|
// 初始化音轨和原音
|
|
|
- forms.multiTracksSelection = data.multiTracksSelection?.split(',') || []
|
|
|
+ forms.multiTracksSelection = data.multiTracksSelection ? data.multiTracksSelection.split(',') : []
|
|
|
|
|
|
- const existSoundList = data.musicSheetSoundList || []
|
|
|
+ const existSoundList = data.musicSheetSoundList ? data.musicSheetSoundList : []
|
|
|
+ const tracks = [] as any
|
|
|
state.partListNames.forEach((item: any) => {
|
|
|
- let audioFileUrl
|
|
|
+ let audioFileUrl = null
|
|
|
existSoundList.forEach((next: any) => {
|
|
|
if (next.track == item.value) {
|
|
|
audioFileUrl = next.audioFileUrl
|
|
@@ -731,6 +760,17 @@ export default defineComponent({
|
|
|
audioFileUrl: audioFileUrl, // 原音
|
|
|
track: item.value // 轨道
|
|
|
})
|
|
|
+ tracks.push(item.value)
|
|
|
+ })
|
|
|
+
|
|
|
+ // 处理没有声轨,但有原音
|
|
|
+ existSoundList.filter((next: any) => {
|
|
|
+ return !tracks.includes(next.track)
|
|
|
+ }).forEach((next: any) => {
|
|
|
+ forms.musicSheetSoundList.push({
|
|
|
+ audioFileUrl: next.audioFileUrl, // 原音
|
|
|
+ track: next.track ? next.track : null // 轨道
|
|
|
+ })
|
|
|
})
|
|
|
}
|
|
|
})
|
|
@@ -755,7 +795,7 @@ export default defineComponent({
|
|
|
model={forms}
|
|
|
ref={formsRef}
|
|
|
label-placement="left"
|
|
|
- label-width="130"
|
|
|
+ label-width="150"
|
|
|
disabled={state.previewMode}
|
|
|
>
|
|
|
<NAlert showIcon={false} style={{ marginBottom: '12px' }}>
|
|
@@ -844,24 +884,6 @@ export default defineComponent({
|
|
|
</NGrid>
|
|
|
<NGrid cols={2}>
|
|
|
<NFormItemGi
|
|
|
- label="曲目类型"
|
|
|
- path="musicSheetType"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择曲目类型',
|
|
|
- trigger: 'change'
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NSelect
|
|
|
- placeholder="请选择曲目类型"
|
|
|
- v-model:value={forms.musicSheetType}
|
|
|
- options={getSelectDataFromObj(musicSheetType)}
|
|
|
- />
|
|
|
- </NFormItemGi>
|
|
|
-
|
|
|
- <NFormItemGi
|
|
|
label="作者属性"
|
|
|
path="sourceType"
|
|
|
rule={[
|
|
@@ -887,76 +909,58 @@ export default defineComponent({
|
|
|
}}
|
|
|
/>
|
|
|
</NFormItemGi>
|
|
|
- </NGrid>
|
|
|
- <NGrid cols={2}>
|
|
|
{forms.sourceType === 'PERSON' && (
|
|
|
- <NFormItemGi
|
|
|
- label="所属人"
|
|
|
- path="musicSheetExtend.userId"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择曲目所属人',
|
|
|
- trigger: ['input', 'change']
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NButton
|
|
|
- disabled={state.previewMode || !forms.sourceType}
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- text
|
|
|
- //v-auth="orchestraSubsidyStandard/update1597887579789053953"
|
|
|
- onClick={() => {
|
|
|
- state.showMusicSheetOwnerDialog = true
|
|
|
- }}
|
|
|
+ <NFormItemGi
|
|
|
+ label="所属人"
|
|
|
+ path="musicSheetExtend.userId"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择曲目所属人',
|
|
|
+ trigger: ['input', 'change']
|
|
|
+ }
|
|
|
+ ]}
|
|
|
>
|
|
|
- {state.ownerName ? state.ownerName : '请选择所属人'}
|
|
|
- </NButton>
|
|
|
- </NFormItemGi>
|
|
|
+ <NButton
|
|
|
+ disabled={state.previewMode || !forms.sourceType}
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ text
|
|
|
+ //v-auth="orchestraSubsidyStandard/update1597887579789053953"
|
|
|
+ onClick={() => {
|
|
|
+ state.showMusicSheetOwnerDialog = true
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {state.ownerName ? state.ownerName : '请选择所属人'}
|
|
|
+ </NButton>
|
|
|
+ </NFormItemGi>
|
|
|
)}
|
|
|
{forms.sourceType === 'ORG' && (
|
|
|
- <NFormItemGi
|
|
|
- label="所属人"
|
|
|
- path="musicSheetExtend.organizationRoleId"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择曲目所属机构',
|
|
|
- trigger: ['input', 'change']
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NButton
|
|
|
- disabled={state.previewMode || !forms.sourceType}
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- text
|
|
|
- //v-auth="orchestraSubsidyStandard/update1597887579789053953"
|
|
|
- onClick={() => {
|
|
|
- state.showMusicSheetOwnerDialog = true
|
|
|
- }}
|
|
|
+ <NFormItemGi
|
|
|
+ label="所属人"
|
|
|
+ path="musicSheetExtend.organizationRoleId"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择曲目所属机构',
|
|
|
+ trigger: ['input', 'change']
|
|
|
+ }
|
|
|
+ ]}
|
|
|
>
|
|
|
- {state.ownerName ? state.ownerName : '请选择所属机构'}
|
|
|
- </NButton>
|
|
|
- </NFormItemGi>
|
|
|
+ <NButton
|
|
|
+ disabled={state.previewMode || !forms.sourceType}
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ text
|
|
|
+ //v-auth="orchestraSubsidyStandard/update1597887579789053953"
|
|
|
+ onClick={() => {
|
|
|
+ state.showMusicSheetOwnerDialog = true
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {state.ownerName ? state.ownerName : '请选择所属机构'}
|
|
|
+ </NButton>
|
|
|
+ </NFormItemGi>
|
|
|
)}
|
|
|
- <NFormItemGi
|
|
|
- label="速度"
|
|
|
- path="playSpeed"
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: false,
|
|
|
- message: '请输入速度'
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NInputNumber
|
|
|
- placeholder="请输入速度"
|
|
|
- v-model:value={forms.playSpeed}
|
|
|
- style="width:100%"
|
|
|
- />
|
|
|
- </NFormItemGi>
|
|
|
</NGrid>
|
|
|
<NGrid cols={2}>
|
|
|
<NFormItemGi
|
|
@@ -1041,6 +1045,24 @@ export default defineComponent({
|
|
|
</NRadioGroup>
|
|
|
</NFormItemGi>
|
|
|
</NGrid>
|
|
|
+ <NGrid cols={2}>
|
|
|
+ <NFormItemGi
|
|
|
+ label="速度"
|
|
|
+ path="playSpeed"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: false,
|
|
|
+ message: '请输入速度'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ <NInputNumber
|
|
|
+ placeholder="请输入速度"
|
|
|
+ v-model:value={forms.playSpeed}
|
|
|
+ style="width:100%"
|
|
|
+ />
|
|
|
+ </NFormItemGi>
|
|
|
+ </NGrid>
|
|
|
<NAlert showIcon={false} style={{ marginBottom: '12px' }}>
|
|
|
曲目上传
|
|
|
</NAlert>
|
|
@@ -1241,6 +1263,29 @@ export default defineComponent({
|
|
|
/>
|
|
|
</NFormItemGi>
|
|
|
</NGrid>
|
|
|
+ <NGrid cols={2}>
|
|
|
+ <NFormItemGi
|
|
|
+ label="多声轨渲染"
|
|
|
+ path="musicSheetType"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择多声轨渲染',
|
|
|
+ trigger: 'change'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ {/*<NSelect*/}
|
|
|
+ {/* placeholder="请选择曲目类型"*/}
|
|
|
+ {/* v-model:value={forms.musicSheetType}*/}
|
|
|
+ {/* options={getSelectDataFromObj(musicSheetType)}*/}
|
|
|
+ {/*/>*/}
|
|
|
+ <NRadioGroup v-model:value={forms.musicSheetType}>
|
|
|
+ <NRadio value={'SINGLE'}>是</NRadio>
|
|
|
+ <NRadio value={'CONCERT'}>否</NRadio>
|
|
|
+ </NRadioGroup>
|
|
|
+ </NFormItemGi>
|
|
|
+ </NGrid>
|
|
|
|
|
|
{forms.musicSheetType && (
|
|
|
<NGrid cols={1}>
|
|
@@ -1281,7 +1326,12 @@ export default defineComponent({
|
|
|
}
|
|
|
]}
|
|
|
>
|
|
|
- <NCheckboxGroup v-model:value={forms.multiTracksSelection}>
|
|
|
+ <NCheckboxGroup v-model:value={forms.multiTracksSelection}
|
|
|
+ onUpdateValue={()=>{
|
|
|
+ console.log("multiTracksSelection",forms.multiTracksSelection)
|
|
|
+ console.log("musicSheetSoundList",forms.musicSheetSoundList)
|
|
|
+ }}
|
|
|
+ >
|
|
|
<NGrid yGap={2} cols={4}>
|
|
|
{state.partListNames.map((item: any) => (
|
|
|
<NGi>
|
|
@@ -1388,62 +1438,92 @@ export default defineComponent({
|
|
|
{/* 只有播放类型为mp3时才会有原音 */}
|
|
|
{forms.playMode === 'MP3' && forms.musicSheetSoundList.length > 0 && (
|
|
|
<>
|
|
|
- {forms.musicSheetSoundList.map((item: any, index: number) => (
|
|
|
- <>
|
|
|
- {item.track?.toLocaleUpperCase?.() != 'COMMON' &&
|
|
|
- forms.multiTracksSelection.indexOf(item.track) > -1 && (
|
|
|
- <NGrid
|
|
|
- class={styles.audioSection}
|
|
|
- // v-show={forms.multiTracksSelection.indexOf(item.track) > -1}
|
|
|
- >
|
|
|
- <NFormItemGi
|
|
|
- span={12}
|
|
|
- label="原音"
|
|
|
- path={`musicSheetSoundList[${index}].audioFileUrl`}
|
|
|
- rule={[
|
|
|
- {
|
|
|
- // required: forms.multiTracksSelection.indexOf(forms.musicSheetSoundList[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 > 1 && (
|
|
|
- <NFormItemGi
|
|
|
- span={12}
|
|
|
- label="所属轨道"
|
|
|
- path={`musicSheetSoundList[${index}].track`}
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择所属轨道'
|
|
|
- }
|
|
|
- ]}
|
|
|
- >
|
|
|
- <NSelect
|
|
|
- placeholder="请选择所属轨道"
|
|
|
- v-model:value={item.track}
|
|
|
- options={initPartsListStatus(item.track)}
|
|
|
- />
|
|
|
- </NFormItemGi>
|
|
|
- )}
|
|
|
- </NGrid>
|
|
|
- )}
|
|
|
- </>
|
|
|
- ))}
|
|
|
+ {forms.musicSheetSoundList.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}
|
|
|
+ >
|
|
|
+ <NFormItemGi
|
|
|
+ span={12}
|
|
|
+ label="原音"
|
|
|
+ path={`musicSheetSoundList[${index}].audioFileUrl`}
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ // required: forms.multiTracksSelection.indexOf(forms.musicSheetSoundList[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[${index}].track`}
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择所属轨道'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ >
|
|
|
+ <NSelect
|
|
|
+ placeholder="请选择所属轨道"
|
|
|
+ value={item.track}
|
|
|
+ options={initPartsListStatus(item.track)}
|
|
|
+ onUpdateValue={(value: any) => {
|
|
|
+ const track = item.track
|
|
|
+ // 声轨交换
|
|
|
+ forms.musicSheetSoundList.forEach((next:any)=>{
|
|
|
+ if (next.track == value) {
|
|
|
+ next.track = track
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (track) {
|
|
|
+ const index = forms.multiTracksSelection.indexOf(item.track)
|
|
|
+ forms.multiTracksSelection.splice(index, 1)
|
|
|
+ }
|
|
|
+ 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.length === 1}
|
|
|
+ onClick={() => removeSys(index)}
|
|
|
+ >
|
|
|
+ 删除
|
|
|
+ </NButton>
|
|
|
+ </NGi>
|
|
|
+ </NGrid>
|
|
|
+ )}
|
|
|
+ </>
|
|
|
+ );
|
|
|
+ })}
|
|
|
</>
|
|
|
)}
|
|
|
</NForm>
|