diff --git a/src/cpns/ClipItemList.vue b/src/cpns/ClipItemList.vue index 457081d..bfdf778 100644 --- a/src/cpns/ClipItemList.vue +++ b/src/cpns/ClipItemList.vue @@ -80,9 +80,18 @@ const props = defineProps({ currentActiveTab: { type: String, required: true + }, + isSearchPanelExpand: { + type: Boolean, + required: true } }) -const emit = defineEmits(['onDataChange', 'onDataRemove', 'onSelectItemAdd', 'onMultiCopyExecute']) +const emit = defineEmits([ + 'onDataChange', + 'onDataRemove', + 'onMultiCopyExecute', + 'toggleMultiSelect' +]) const isOverSizedContent = (item) => { const { type, data } = item if (type === 'text') { @@ -159,8 +168,6 @@ const handleItemClick = (ev, item) => { selectItemList.value.push(item) // 添加到已选列表中 } } - - emit('onSelectItemAdd') } else { const { button } = ev if (button === 0) { @@ -194,25 +201,23 @@ onMounted(() => { const isCopy = (ctrlKey || metaKey) && (key === 'C' || key === 'c') const isNumber = parseInt(key) <= 9 && parseInt(key) >= 0 const isShift = key === 'Shift' + const isSpace = key === ' ' + const activeNode = !props.isMultiple + ? document.querySelector('.clip-item.active' + (isArrowDown ? '+.clip-item' : '')) + : document.querySelector('.clip-item.multi-active' + (isArrowDown ? '+.clip-item' : '')) if (isArrowUp) { + if (activeIndex.value === 1) window.toTop() if (activeIndex.value > 0) { activeIndex.value-- - const activeNode = document.querySelector('.clip-item.active') - if (activeIndex.value === 1) { - window.toTop() - } else { - activeNode?.previousElementSibling?.previousElementSibling?.scrollIntoView({ - block: 'nearest', - inline: 'nearest' - }) - } + activeNode.previousElementSibling.previousElementSibling.scrollIntoView({ + block: 'nearest', + inline: 'nearest' + }) } } else if (isArrowDown) { if (activeIndex.value < props.showList.length - 1) { activeIndex.value++ - document - .querySelector('.clip-item.active+.clip-item') - ?.scrollIntoView({ block: 'nearest', inline: 'nearest' }) + activeNode.scrollIntoView({ block: 'nearest', inline: 'nearest' }) } } else if (isCopy) { if (!props.fullData.data) { @@ -246,6 +251,25 @@ onMounted(() => { if (props.isMultiple) { isShiftDown.value = true } + } else if (isSpace) { + if (props.isSearchPanelExpand) { + // 搜索栏展开状态 不进入多选 + return + } + if (!props.isMultiple) { + emit('toggleMultiSelect') // 如果不是多选状态 则切换到多选状态 + } + e.preventDefault() + const i = selectItemList.value.findIndex((item) => item === props.showList[activeIndex.value]) + if (i !== -1) { + selectItemList.value.splice(i, 1) // 如果已选中 则取消选中 + } else { + selectItemList.value.push(props.showList[activeIndex.value]) // 如果未选中 则选中 + activeIndex.value++ + document + .querySelector('.clip-item.multi-active+.clip-item') + .scrollIntoView({ block: 'nearest', inline: 'nearest' }) + } } }) document.addEventListener('keyup', (e) => { diff --git a/src/views/Main.vue b/src/views/Main.vue index 4600acd..4021a85 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -47,7 +47,9 @@ :fullData="fullData" :isMultiple="isMultiple" :currentActiveTab="activeTab" + :isSearchPanelExpand="isSearchPanelExpand" @onMultiCopyExecute="handleMultiCopyBtnClick" + @toggleMultiSelect="() => (isMultiple = true)" @onDataChange="toggleFullData" @onDataRemove="handleDataRemove" > @@ -291,6 +293,7 @@ onMounted(() => { const isEnter = key === 'Enter' const isShift = key === 'Shift' const isAlt = key === 'Alt' + const isSpace = key === ' ' if (isTab) { const tabTypes = tabs.map((item) => item.type) const index = tabTypes.indexOf(activeTab.value) @@ -312,6 +315,7 @@ onMounted(() => { } else if (isMultiple.value) { // 退出多选状态 isMultiple.value = !isMultiple.value + e.stopPropagation() } else { // 无上述情况 执行默认: 隐藏uTools主窗口 } @@ -327,6 +331,8 @@ onMounted(() => { } else if (ctrlKey || metaKey || isAlt) { // Ctrl: utools模拟执行粘贴时触发 // Alt: + } else if (isSpace) { + // 空格向下多选 } else { window.focus() // 其他键盘事件 直接聚焦搜索框 }