From 9e5ffc65224cbb8efb41758a82e63120d6a92764 Mon Sep 17 00:00:00 2001 From: LuSrackhall <3647637206@qq.com> Date: Wed, 13 Nov 2024 06:01:11 +0800 Subject: [PATCH] =?UTF-8?q?feat(ui):=20=E9=94=AE=E9=9F=B3=E5=8C=85?= =?UTF-8?q?=E6=9E=B6=E6=9E=84=E5=8F=98=E6=9B=B4,=20=E4=BD=BF=E5=BE=97?= =?UTF-8?q?=E5=8F=AF=E4=BB=A5=E5=9C=A8=E9=94=AE=E9=9F=B3=E4=B8=AD=E9=80=89?= =?UTF-8?q?=E6=8B=A9=20=E6=BA=90=E6=96=87=E4=BB=B6=E3=80=81=E5=A3=B0?= =?UTF-8?q?=E9=9F=B3=E3=80=81=E6=8C=89=E9=94=AE=E9=9F=B3=20=E4=B8=89?= =?UTF-8?q?=E7=A7=8D=E7=B1=BB=E5=9E=8B=E3=80=82=20=E6=9C=AC=E6=AC=A1?= =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=B8=BB=E8=A6=81=E9=92=88=E5=AF=B9=20?= =?UTF-8?q?=E5=88=B6=E4=BD=9C=E6=96=B0=E7=9A=84=E6=8C=89=E9=94=AE=E9=9F=B3?= =?UTF-8?q?=20=E5=AF=B9=E8=AF=9D=E6=A1=86=E3=80=82=20=20=E5=9B=A0=E7=A0=B4?= =?UTF-8?q?=E5=9D=8F=E6=80=A7=E5=8F=98=E6=9B=B4=20=E7=BC=96=E8=BE=91?= =?UTF-8?q?=E5=B7=B2=E6=9C=89=E6=8C=89=E9=94=AE=E9=9F=B3=20=E5=9C=A8?= =?UTF-8?q?=E9=80=82=E9=85=8D=E4=B9=8B=E5=89=8D=E5=B0=86=E6=97=A0=E6=B3=95?= =?UTF-8?q?=E6=AD=A3=E5=B8=B8=E5=B7=A5=E4=BD=9C=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit commit #39、commit #36 --- .../Create_keytone_pkg.vue | 246 ++++++++++++++++-- 1 file changed, 220 insertions(+), 26 deletions(-) diff --git a/frontend/src/pages/KeytonePkgPageChildren/Create_keytone_pkg.vue b/frontend/src/pages/KeytonePkgPageChildren/Create_keytone_pkg.vue index 0568009..1123f42 100644 --- a/frontend/src/pages/KeytonePkgPageChildren/Create_keytone_pkg.vue +++ b/frontend/src/pages/KeytonePkgPageChildren/Create_keytone_pkg.vue @@ -827,29 +827,35 @@ outlined stack-label v-model="selectedSoundsForDown" - :options="soundList" - :option-label=" - (item) => { + :options="downSoundList" + :option-label="(item: any) => { + if (item.key === 'audio_files') { + return (options.find((option) => item.key === option.value)?.label ) + '  §   ' + (item?.value?.name + item?.value?.type); + } + if (item.key === 'sounds') { // 此处的item可以是any , 但其soundList的源类型, 必须是指定准确, 否则此处会发生意外报错, 且无法定位 - if (item.soundValue.name !== '' && item.soundValue.name !== undefined) { - return item.soundValue.name; + if (item.value.soundValue?.name !== '' && item.value.soundValue?.name !== undefined) { + return item.value.soundValue.name; } else { - return ( + return (options.find((option) => item.key === option.value)?.label ) + '      §   ' + ( soundFileList.find( - (soundFile) => - soundFile.sha256 === item.soundValue.source_file_for_sound.sha256 && - soundFile.name_id === item.soundValue.source_file_for_sound.name_id + (soundFile:any) => + soundFile.sha256 === item.value.soundValue?.source_file_for_sound?.sha256 && + soundFile.name_id === item.value.soundValue?.source_file_for_sound?.name_id )?.name + ' - ' + ' [' + - item.soundValue.cut.start_time + + item.value.soundValue?.cut?.start_time + ' ~ ' + - item.soundValue.cut.end_time + + item.value.soundValue?.cut?.end_time + ']' ); } } - " + if (item.key === 'key_sounds') { + return (options.find((option) => item.key === option.value)?.label ) + '  §   ' + (item.value.keySoundValue?.name); + } + }" label="选择声音 (多选)" multiple use-chips @@ -885,6 +891,65 @@ ref="downSoundSelectDom" @update:model-value="downSoundSelectDom?.hidePopup()" /> +
+ + + + + +
@@ -916,29 +981,35 @@ outlined stack-label v-model="selectedSoundsForUp" - :options="soundList" - :option-label=" - (item) => { + :options="upSoundList" + :option-label="(item: any) => { + if (item.key === 'audio_files') { + return (options.find((option) => item.key === option.value)?.label ) + '  §   ' + (item?.value?.name + item?.value?.type); + } + if (item.key === 'sounds') { // 此处的item可以是any , 但其soundList的源类型, 必须是指定准确, 否则此处会发生意外报错, 且无法定位 - if (item.soundValue.name !== '' && item.soundValue.name !== undefined) { - return item.soundValue.name; + if (item.value.soundValue?.name !== '' && item.value.soundValue?.name !== undefined) { + return item.value.soundValue.name; } else { - return ( + return (options.find((option) => item.key === option.value)?.label ) + '      §   ' + ( soundFileList.find( - (soundFile) => - soundFile.sha256 === item.soundValue.source_file_for_sound.sha256 && - soundFile.name_id === item.soundValue.source_file_for_sound.name_id + (soundFile:any) => + soundFile.sha256 === item.value.soundValue?.source_file_for_sound?.sha256 && + soundFile.name_id === item.value.soundValue?.source_file_for_sound?.name_id )?.name + ' - ' + ' [' + - item.soundValue.cut.start_time + + item.value.soundValue?.cut?.start_time + ' ~ ' + - item.soundValue.cut.end_time + + item.value.soundValue?.cut?.end_time + ']' ); } } - " + if (item.key === 'key_sounds') { + return (options.find((option) => item.key === option.value)?.label ) + '  §   ' + (item.value.keySoundValue?.name); + } + }" label="选择声音 (多选)" multiple use-chips @@ -974,6 +1045,65 @@ ref="upSoundSelectDom" @update:model-value="upSoundSelectDom?.hidePopup()" /> +
+ + + + + +
@@ -1529,6 +1659,13 @@ watch(selectedSound, () => { } }); +// 选项列表(其中包含: 源文件、声音、按键音 三种选项可供选择) +const options = [ + { label: '源文件', value: 'audio_files' }, + { label: '声音', value: 'sounds' }, + { label: '按键音', value: 'key_sounds' }, +]; + // 按键音 type PlayMode = { label: string; mode: string }; const playModeOptions: Array = [ @@ -1554,6 +1691,27 @@ const maxSelectionForDown = computed(() => { /* --- 在vue3.5中, 用useTemplateRef方式获取dom元素, 有助于增强可读性 const downSoundSelectDom = ref(); // 在vue3.5中, 用useTemplateRef方式获取dom元素, 有助于增强可读性*/ const downSoundSelectDom = useTemplateRef('downSoundSelectDom'); +const downTypeGroup = ref>(['sounds']); +const downSoundList = computed(() => { + const List: Array = []; + if (downTypeGroup.value.includes('audio_files')) { + soundFileList.value.forEach((item) => { + List.push({ key: 'audio_files', value: item }); + }); + } + if (downTypeGroup.value.includes('sounds')) { + soundList.value.forEach((item) => { + List.push({ key: 'sounds', value: item }); + }); + } + if (downTypeGroup.value.includes('key_sounds')) { + keySoundList.value.forEach((item) => { + List.push({ key: 'key_sounds', value: item }); + }); + } + console.log('List=', List); + return List; +}); // -- configureUpSound const selectedSoundsForUp = ref>([]); @@ -1564,6 +1722,26 @@ const maxSelectionForUp = computed(() => { /* --- 在vue3.5中, 用useTemplateRef方式获取dom元素, 有助于增强可读性 const upSoundSelectDom = ref();*/ const upSoundSelectDom = useTemplateRef('upSoundSelectDom'); +const upTypeGroup = ref>(['sounds']); +const upSoundList = computed(() => { + const List: Array = []; + if (upTypeGroup.value.includes('audio_files')) { + soundFileList.value.forEach((item) => { + List.push({ key: 'audio_files', value: item }); + }); + } + if (upTypeGroup.value.includes('sounds')) { + soundList.value.forEach((item) => { + List.push({ key: 'sounds', value: item }); + }); + } + if (upTypeGroup.value.includes('key_sounds')) { + keySoundList.value.forEach((item) => { + List.push({ key: 'key_sounds', value: item }); + }); + } + return List; +}); // 按键音编辑 const editExistingKeySound = ref(false); @@ -1628,13 +1806,29 @@ function saveKeySoundConfig( down: { mode: params.down.mode, value: params.down.value.map((item) => { - return item.soundKey; + if (item.key === 'audio_files') { + return { type: 'audio_files', value: item.value.sha256 }; + } + if (item.key === 'sounds') { + return { type: 'sounds', value: item.value.soundKey }; + } + if (item.key === 'key_sounds') { + return { type: 'key_sounds', value: item.value.keySoundKey }; + } }), }, up: { mode: params.up.mode, value: params.up.value.map((item) => { - return item.soundKey; + if (item.key === 'audio_files') { + return { type: 'audio_files', value: item.value.sha256 }; + } + if (item.key === 'sounds') { + return { type: 'sounds', value: item.value.soundKey }; + } + if (item.key === 'key_sounds') { + return { type: 'key_sounds', value: item.value.keySoundKey }; + } }), }, };