From c0515c9c4f144a4144203496e5ecc56e9b20f0dc Mon Sep 17 00:00:00 2001
From: lyswhut <lyswhut@qq.com>
Date: Fri, 10 Feb 2023 21:06:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=8E=BB=E9=87=8D=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E7=A7=BB=E9=99=A4=E6=AD=8C=E6=9B=B2=E5=90=8E=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E6=B2=A1=E6=9C=89=E5=88=B7=E6=96=B0=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../MyList/components/DuplicateMusicModal.vue  | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/renderer/views/List/MyList/components/DuplicateMusicModal.vue b/src/renderer/views/List/MyList/components/DuplicateMusicModal.vue
index fdfb23ff..04142136 100644
--- a/src/renderer/views/List/MyList/components/DuplicateMusicModal.vue
+++ b/src/renderer/views/List/MyList/components/DuplicateMusicModal.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import { shallowReactive, watch, toRaw, computed } from '@common/utils/vueTools'
+import { ref, watch, computed, markRawList } from '@common/utils/vueTools'
 import { playList } from '@renderer/core/player'
 import { getListMusics, removeListMusics } from '@renderer/store/list/action'
 import { isFullscreen } from '@renderer/store'
@@ -56,33 +56,31 @@ export default {
   },
   emits: ['update:visible'],
   setup(props) {
-    const duplicateList = shallowReactive([])
+    const duplicateList = ref([])
     const listItemHeight = computed(() => {
       return Math.ceil((isFullscreen.value ? getFontSizeWithScreen() : appSetting['common.fontSize']) * 3.2)
     })
 
     const handlePlay = (index) => {
-      const { index: musicInfoIndex } = duplicateList[index]
+      const { index: musicInfoIndex } = duplicateList.value[index]
       playList(props.listInfo.id, musicInfoIndex)
     }
     const handleFilterList = async() => {
       // console.time('filter')
-      duplicateList.splice(
-        0,
-        duplicateList.length,
-        ...(await window.lx.worker.main.filterDuplicateMusic(toRaw(await getListMusics(props.listInfo.id)))))
-
+      duplicateList.value = markRawList(await window.lx.worker.main.filterDuplicateMusic(await getListMusics(props.listInfo.id)))
+      // console.log(duplicateList.value)
       // console.timeEnd('filter')
     }
     const handleRemove = async(index) => {
-      const { musicInfo: targetMusicInfo } = duplicateList.splice(index, 1)[0]
+      const { musicInfo: targetMusicInfo } = duplicateList.value.splice(index, 1)[0]
+      duplicateList.value = [...duplicateList.value]
       await removeListMusics({ listId: props.listInfo.id, ids: [targetMusicInfo.id] })
       await handleFilterList()
     }
 
     watch(() => props.visible, (visible) => {
       if (visible) {
-        if (duplicateList.length) duplicateList.splice(0, duplicateList.length)
+        if (duplicateList.value.length) duplicateList.value = []
         handleFilterList()
       }
     })