下载列表菜单新增歌曲添加弹窗（#2537）

src/renderer/views/Download/index.vue

@@ -62,6 +62,8 @@
       <base-menu v-model="isShowItemMenu" :menus="menus" :xy="menuLocation" item-name="name" @menu-click="handleMenuClick" />
       <!-- <base-menu :menus="listItemMenu" :location="listMenu.menuLocation" item-name="name" :is-show="listMenu.isShowItemMenu" @menu-click="handleListItemMenuClick" /> -->
     </div>
+    <common-list-add-modal v-model:show="isShowListAdd" :music-info="selectedAddMusicInfo" teleport="#view" />
+    <common-list-add-multiple-modal v-model:show="isShowListAddMultiple" :music-list="selectedList" teleport="#view" @confirm="removeAllSelect" />
   </div>
 </template>
 
@@ -75,6 +77,7 @@ import useTab from './useTab'
 import useMenu from './useMenu'
 import usePlay from './usePlay'
 import useTaskActions from './useTaskActions'
+import useMusicAdd from './useMusicAdd'
 import { downloadStatus } from '@renderer/store/download/state'
 import { appSetting } from '@renderer/store/setting'
 
@@ -113,6 +116,13 @@ export default {
       handleOpenFile,
     } = useTaskActions({ list, removeAllSelect, selectedList })
 
+    const {
+      isShowListAdd,
+      isShowListAddMultiple,
+      selectedAddMusicInfo,
+      handleShowMusicAddModal,
+    } = useMusicAdd({ selectedList, list })
+
     const {
       menus,
       menuLocation,
@@ -126,6 +136,7 @@ export default {
       handleOpenFile,
       handlePlayMusic,
       handlePlayMusicLater,
+      handleShowMusicAddModal,
       handleSearch,
       handleOpenMusicDetail,
     })
@@ -209,6 +220,12 @@ export default {
       listItemHeight,
       playTaskId,
 
+      isShowListAdd,
+      isShowListAddMultiple,
+      selectedAddMusicInfo,
+
+      removeAllSelect,
+
       menus,
       menuLocation,
       isShowItemMenu,

src/renderer/views/Download/useMenu.js

@@ -10,6 +10,7 @@ export default ({
   handleOpenFile,
   handlePlayMusic,
   handlePlayMusicLater,
+  handleShowMusicAddModal,
   handleSearch,
   handleOpenMusicDetail,
 }) => {
@@ -22,6 +23,7 @@ export default ({
     sourceDetail: true,
     search: true,
     remove: true,
+    addTo: true,
   })
   const t = useI18n()
   const menuLocation = shallowReactive({ x: 0, y: 0 })
@@ -54,6 +56,11 @@ export default ({
         action: 'file',
         hide: !itemMenuControl.file,
       },
+      {
+        name: t('list__add_to'),
+        action: 'addTo',
+        disabled: !itemMenuControl.addTo,
+      },
       {
         name: t('list__source_detail'),
         action: 'sourceDetail',
@@ -129,6 +136,9 @@ export default ({
       case 'playLater':
         handlePlayMusicLater(index)
         break
+      case 'addTo':
+        handleShowMusicAddModal(index)
+        break
       case 'search':
         handleSearch(index)
         break

src/renderer/views/Download/useMusicAdd.js

@@ -0,0 +1,25 @@
+import { ref, shallowRef, nextTick, markRaw } from '@common/utils/vueTools'
+
+export default ({ selectedList, list }) => {
+  const isShowListAdd = ref(false)
+  const isShowListAddMultiple = ref(false)
+  const selectedAddMusicInfo = shallowRef(null)
+
+  const handleShowMusicAddModal = (index, single) => {
+    if (selectedList.value.length && !single) {
+      isShowListAddMultiple.value = true
+    } else {
+      selectedAddMusicInfo.value = markRaw(list.value[index].metadata.musicInfo)
+      nextTick(() => {
+        isShowListAdd.value = true
+      })
+    }
+  }
+
+  return {
+    isShowListAdd,
+    isShowListAddMultiple,
+    selectedAddMusicInfo,
+    handleShowMusicAddModal,
+  }
+}