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

This commit is contained in:
lyswhut
2023-12-05 11:14:44 +08:00
parent 7d504f9231
commit cac2d0e050
8 changed files with 24 additions and 18 deletions
+1 -1
View File
@@ -47,7 +47,7 @@ export default {
},
label: {
type: String,
required: true,
default: undefined,
},
disabled: {
type: Boolean,
@@ -155,7 +155,7 @@ export default {
listItemHeight,
handleSelectData,
removeAllSelect,
} = useList({ props })
} = useList({ props, listRef })
const {
handlePlayMusic,
@@ -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) {