优化列表全选机制，修复列表未获得焦点时仍然可以全选的问题

publish/changeLog.md

@@ -17,6 +17,7 @@
 
 - 更新zh-tw翻译
 - 自定义源列显示源版本号、作者名字
+- 优化列表全选机制，修复列表未获得焦点时仍然可以全选的问题
 
 ### 修复
 

src/renderer/components/base/Checkbox.vue

@@ -47,7 +47,7 @@ export default {
     },
     label: {
       type: String,
-      required: true,
+      default: undefined,
     },
     disabled: {
       type: Boolean,

src/renderer/components/material/OnlineList/index.vue

@@ -155,7 +155,7 @@ export default {
       listItemHeight,
       handleSelectData,
       removeAllSelect,
-    } = useList({ props })
+    } = useList({ props, listRef })
 
     const {
       handlePlayMusic,

src/renderer/components/material/OnlineList/useList.ts

@@ -1,10 +1,11 @@
-import { computed, watch, ref, onBeforeUnmount } from '@common/utils/vueTools'
+import { computed, watch, ref, onBeforeUnmount, type Ref } from '@common/utils/vueTools'
 import { isFullscreen } from '@renderer/store'
 import { appSetting } from '@renderer/store/setting'
 import { getFontSizeWithScreen } from '@renderer/utils'
 
-const useKeyEvent = ({ handleSelectAllData }: {
+const useKeyEvent = ({ handleSelectAllData, listRef }: {
   handleSelectAllData: () => void
+  listRef: Ref<any>
 }) => {
   const keyEvent = {
     isShiftDown: false,
@@ -24,7 +25,7 @@ const useKeyEvent = ({ handleSelectAllData }: {
     keyEvent.isModDown &&= false
   }
   const handle_key_mod_a_down = ({ event }: LX.KeyDownEevent) => {
-    if (!event || (event.target as HTMLElement).tagName == 'INPUT') return
+    if (!event || (event.target as HTMLElement).tagName == 'INPUT' || document.activeElement != listRef.value?.$el) return
     event.preventDefault()
     if (event.repeat) return
     keyEvent.isModDown = false
@@ -48,10 +49,11 @@ const useKeyEvent = ({ handleSelectAllData }: {
 }
 
 
-export default ({ props }: {
+export default ({ props, listRef }: {
   props: {
     list: LX.Music.MusicInfoOnline[]
   }
+  listRef: Ref<any>
 }) => {
   const selectedList = ref<LX.Music.MusicInfoOnline[]>([])
   let lastSelectIndex = -1
@@ -66,7 +68,7 @@ export default ({ props }: {
     removeAllSelect()
     selectedList.value = [...props.list]
   }
-  const keyEvent = useKeyEvent({ handleSelectAllData })
+  const keyEvent = useKeyEvent({ handleSelectAllData, listRef })
 
   const handleSelectData = (clickIndex: number) => {
     if (keyEvent.isShiftDown) {

src/renderer/views/Download/index.vue

@@ -20,7 +20,7 @@
       </div>
       <div v-if="list.length" ref="dom_listContent" :class="$style.content">
         <base-virtualized-list
-          v-slot="{ item, index }" :list="list" key-name="id" :item-height="listItemHeight"
+          ref="listRef" v-slot="{ item, index }" :list="list" key-name="id" :item-height="listItemHeight"
           container-class="scroll" content-class="list"
         >
           <div
@@ -68,6 +68,7 @@
 <script>
 // import { checkPath, openDirInExplorer, openUrl } from '@common/utils/electron'
 
+import { ref } from '@common/utils/vueTools'
 import useListInfo from './useListInfo'
 import useList from './useList'
 import useTab from './useTab'
@@ -80,6 +81,7 @@ import { appSetting } from '@renderer/store/setting'
 export default {
   name: 'Download',
   setup() {
+    const listRef = ref()
     const { tabs, activeTab } = useTab()
 
     const {
@@ -95,7 +97,7 @@ export default {
       listItemHeight,
       removeAllSelect,
       handleSelectData,
-    } = useList({ list, listAll })
+    } = useList({ listRef, list, listAll })
 
     const {
       handlePlayMusic,
@@ -196,6 +198,7 @@ export default {
       return quality == 'flac24bit' ? 'FLAC Hires' : quality?.toUpperCase()
     }
     return {
+      listRef,
       list,
       downloadStatus,
       rightClickSelectedIndex,

src/renderer/views/Download/useList.js

@@ -3,7 +3,7 @@ import { isFullscreen } from '@renderer/store'
 import { getFontSizeWithScreen } from '@renderer/utils'
 import { appSetting } from '@renderer/store/setting'
 
-const useKeyEvent = ({ handleSelectAllData }) => {
+const useKeyEvent = ({ listRef, handleSelectAllData }) => {
   const keyEvent = {
     isShiftDown: false,
     isModDown: false,
@@ -22,7 +22,7 @@ const useKeyEvent = ({ handleSelectAllData }) => {
     keyEvent.isModDown &&= false
   }
   const handle_key_mod_a_down = ({ event }) => {
-    if (event.target.tagName == 'INPUT') return
+    if (event.target.tagName == 'INPUT' || document.activeElement != listRef.value?.$el) return
     event.preventDefault()
     if (event.repeat) return
     keyEvent.isModDown = false
@@ -45,7 +45,7 @@ const useKeyEvent = ({ handleSelectAllData }) => {
   return keyEvent
 }
 
-export default ({ list, listAll }) => {
+export default ({ listRef, list, listAll }) => {
   const selectedList = ref([])
 
   let lastSelectIndex = -1
@@ -60,7 +60,7 @@ export default ({ list, listAll }) => {
     removeAllSelect()
     selectedList.value = [...list.value]
   }
-  const keyEvent = useKeyEvent({ handleSelectAllData })
+  const keyEvent = useKeyEvent({ handleSelectAllData, listRef })
 
   const handleSelectData = clickIndex => {
     if (keyEvent.isShiftDown) {

src/renderer/views/List/MusicList/index.vue

@@ -164,7 +164,7 @@ export default {
       listItemHeight,
       handleSelectData,
       removeAllSelect,
-    } = useList({ list })
+    } = useList({ listRef, list })
 
     const {
       handlePlayMusic,

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

@@ -3,7 +3,7 @@ import { isFullscreen } from '@renderer/store'
 import { getFontSizeWithScreen } from '@renderer/utils'
 import { appSetting } from '@renderer/store/setting'
 
-const useKeyEvent = ({ handleSelectAllData }) => {
+const useKeyEvent = ({ handleSelectAllData, listRef }) => {
   const keyEvent = {
     isShiftDown: false,
     isModDown: false,
@@ -22,7 +22,7 @@ const useKeyEvent = ({ handleSelectAllData }) => {
     keyEvent.isModDown &&= false
   }
   const handle_key_mod_a_down = ({ event }) => {
-    if (event.target.tagName == 'INPUT') return
+    if (event.target.tagName == 'INPUT' || document.activeElement != listRef.value?.$el) return
     event.preventDefault()
     if (event.repeat) return
     keyEvent.isModDown = false
@@ -45,7 +45,7 @@ const useKeyEvent = ({ handleSelectAllData }) => {
   return keyEvent
 }
 
-export default ({ list }) => {
+export default ({ listRef, list }) => {
   const selectedList = ref([])
 
   let lastSelectIndex = -1
@@ -60,7 +60,7 @@ export default ({ list }) => {
     removeAllSelect()
     selectedList.value = [...list.value]
   }
-  const keyEvent = useKeyEvent({ handleSelectAllData })
+  const keyEvent = useKeyEvent({ listRef, handleSelectAllData })
 
   const handleSelectData = clickIndex => {
     if (keyEvent.isShiftDown) {