更新 歌曲换源 机制

src/renderer/core/player/action.ts

@@ -232,6 +232,23 @@ const handlePlay = () => {
   })
 }
 
+/**
+ * 播放列表内歌曲
+ * @param listId 列表id
+ * @param id 歌曲id
+ */
+export const playListById = (listId: string, id: string) => {
+  const prevListId = playInfo.playerListId
+  setPlayListId(listId)
+  // pause()
+  const musicInfo = getList(listId).find(m => m.id == id)
+  if (!musicInfo) return
+  setPlayMusicInfo(listId, musicInfo)
+  if (appSetting['player.isAutoCleanPlayedList'] || prevListId != listId) clearPlayedList()
+  clearTempPlayeList()
+  handlePlay()
+}
+
 /**
  * 播放列表内歌曲
  * @param listId 列表id

src/renderer/views/List/MusicList/components/MusicToggleModal.vue

@@ -18,7 +18,7 @@
               <button type="button" :class="$style.btn" @click="openDetail(item)">
                 <svg-icon name="share" />
               </button>
-              <button type="button" :class="$style.btn" @click="handleToggle(item)">
+              <button type="button" :class="$style.btn" @click="handlePlay(item)">
                 <svg v-once version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" height="50%" viewBox="0 0 287.386 287.386" space="preserve">
                   <use xlink:href="#icon-testPlay" />
                 </svg>
@@ -56,15 +56,19 @@
             </h2>
           </template>
         </div>
-        <base-btn :disabled="!toggleMusicInfo" :class="$style.btn" @click="handleClean">{{ $t('music_toggle_clean') }}</base-btn>
+        <base-btn :disabled="!toggleMusicInfo || musicInfo.id == toggleMusicInfo.id" :class="$style.btn" @click="handleConfirm">{{ $t('music_toggle_confirm') }}</base-btn>
       </div>
     </main>
   </material-modal>
 </template>
 
 <script>
+import { LIST_IDS } from '@common/constants'
 import { openUrl } from '@common/utils/electron'
+import { playNext } from '@renderer/core/player'
 import { getSourceI18nPrefix } from '@renderer/store'
+import { addTempPlayList } from '@renderer/store/player/action'
+import { playMusicInfo } from '@renderer/store/player/state'
 import { toNewMusicInfo, toOldMusicInfo } from '@renderer/utils'
 import musicSdk from '@renderer/utils/musicSdk'
 import { markRaw } from 'vue'
@@ -106,8 +110,8 @@ export default {
     show(n) {
       if (n) {
         this.isError = false
+        this.toggleMusicInfo = null
         const musicInfo = this.musicInfo
-        this.toggleMusicInfo = musicInfo.meta.toggleMusicInfo
         this.tabs = []
         this.lists = {}
         this.loading = true
@@ -143,17 +147,19 @@ export default {
     handleClose() {
       this.$emit('update:show', false)
     },
-    handleClean() {
-      this.handleToggle(null)
+    handleConfirm() {
+      this.$emit('toggle', this.toggleMusicInfo)
     },
     openDetail(minfo) {
       const url = musicSdk[minfo.source]?.getMusicDetailPageUrl(toOldMusicInfo(minfo))
       if (!url) return
       void openUrl(url)
     },
-    handleToggle(info) {
-      this.toggleMusicInfo = info
-      this.$emit('toggle', info)
+    handlePlay(musicInfo) {
+      this.toggleMusicInfo = musicInfo
+      const isPlaying = !!playMusicInfo.musicInfo
+      addTempPlayList([{ listId: LIST_IDS.PLAY_LATER, musicInfo, isTop: true }])
+      if (isPlaying) void playNext()
     },
   },
 }

src/renderer/views/List/MusicList/useMusicToggle.js

@@ -1,13 +1,16 @@
 // import { updateListMusicsPosition } from '@renderer/store/list/action'
 import { ref, nextTick } from '@common/utils/vueTools'
-import { updateListMusics } from '@renderer/store/list/listManage'
-import { playList } from '@renderer/core/player'
-import { getListMusicsFromCache } from '@renderer/store/list/action'
+import { removeListMusics } from '@renderer/store/list/listManage'
+import { playListById } from '@renderer/core/player'
+import { addListMusics, updateListMusicsPosition } from '@renderer/store/list/action'
 import { playMusicInfo } from '@renderer/store/player/state'
+import { dialog } from '@renderer/plugins/Dialog'
+import { useI18n } from '@renderer/plugins/i18n'
 
 export default (props, list) => {
   const isShowMusicToggleModal = ref(false)
   const musicInfo = ref(null)
+  const t = useI18n()
 
   const handleShowMusicToggleModal = (index) => {
     musicInfo.value = list.value[index]
@@ -16,30 +19,32 @@ export default (props, list) => {
     })
   }
 
-  const toggleSource = (toggleMusicInfo) => {
-    const id = musicInfo.value.id
-    const index = list.value.findIndex(m => m.id == id)
-    if (index < 0) {
+  const toggleSource = async(toggleMusicInfo) => {
+    const oldId = musicInfo.value.id
+    let oldIdx = list.value.findIndex(m => m.id == oldId)
+    if (oldIdx < 0) {
       isShowMusicToggleModal.value = false
+      await addListMusics(props.listId, [toggleMusicInfo])
       return
     }
-    musicInfo.value.meta.toggleMusicInfo = toggleMusicInfo
-    updateListMusics([
-      {
-        id: props.listId,
-        musicInfo: {
-          ...musicInfo.value,
-          meta: {
-            ...musicInfo.value.meta,
-            toggleMusicInfo,
-          },
-        },
-      },
-    ])
-    const rawInfo = getListMusicsFromCache(props.listId)[index]
-    rawInfo.meta.toggleMusicInfo = toggleMusicInfo
-    if (toggleMusicInfo || (playMusicInfo.listId == props.listId && playMusicInfo.musicInfo?.id == rawInfo.id)) {
-      playList(props.listId, index)
+    const id = toggleMusicInfo.id
+    const index = list.value.findIndex(m => m.id == id)
+    const removeIds = [oldId]
+    if (index > -1) {
+      if (!await dialog.confirm({
+        message: t('music_toggle_duplicate_tip'),
+        cancelButtonText: t('cancel_button_text'),
+        confirmButtonText: t('confirm_button_text'),
+      })) return
+      removeIds.push(id)
+    }
+    isShowMusicToggleModal.value = false
+    await removeListMusics({ listId: props.listId, ids: removeIds })
+    await addListMusics(props.listId, [toggleMusicInfo], 'bottom')
+    if (index != -1 && index < oldIdx) oldIdx--
+    await updateListMusicsPosition({ listId: props.listId, ids: [id], position: oldIdx })
+    if (playMusicInfo.listId == props.listId && playMusicInfo.musicInfo?.id == oldId) {
+      playListById(props.listId, toggleMusicInfo.id)
     }
   }