mirror of
https://gitee.com/dromara/go-view.git
synced 2025-02-24 00:02:51 +08:00
perf: 优化 ctrl 监听
This commit is contained in:
parent
293259a97d
commit
af1c280f28
@ -172,10 +172,7 @@ export const useMouseHandle = () => {
|
|||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
if (item.status.lock) return
|
if (item.status.lock) return
|
||||||
// 若此时按下了 CTRL, 表示多选
|
// 若此时按下了 CTRL, 表示多选
|
||||||
if (
|
if (window.$KeyboardActive?.ctrl) {
|
||||||
window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
|
||||||
window.$KeyboardActive?.has(MacKeyboard.CTRL_SOURCE_KEY)
|
|
||||||
) {
|
|
||||||
// 若已选中,则去除
|
// 若已选中,则去除
|
||||||
if (chartEditStore.targetChart.selectId.includes(item.id)) {
|
if (chartEditStore.targetChart.selectId.includes(item.id)) {
|
||||||
const exList = chartEditStore.targetChart.selectId.filter(e => e !== item.id)
|
const exList = chartEditStore.targetChart.selectId.filter(e => e !== item.id)
|
||||||
@ -193,11 +190,7 @@ export const useMouseHandle = () => {
|
|||||||
if (item.status.lock) return
|
if (item.status.lock) return
|
||||||
onClickOutSide()
|
onClickOutSide()
|
||||||
// 按下左键 + CTRL
|
// 按下左键 + CTRL
|
||||||
if (
|
if (e.buttons === MouseEventButton.LEFT && window.$KeyboardActive?.ctrl)
|
||||||
e.buttons === MouseEventButton.LEFT &&
|
|
||||||
(window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
|
||||||
window.$KeyboardActive?.has(MacKeyboard.CTRL_SOURCE_KEY))
|
|
||||||
)
|
|
||||||
return
|
return
|
||||||
|
|
||||||
// 按下右键 + 选中多个 + 目标元素是多选子元素
|
// 按下右键 + 选中多个 + 目标元素是多选子元素
|
||||||
|
@ -142,11 +142,7 @@ const optionsHandle = (
|
|||||||
// 点击
|
// 点击
|
||||||
const clickHandle = (e: MouseEvent) => {
|
const clickHandle = (e: MouseEvent) => {
|
||||||
// 按下左键 + CTRL
|
// 按下左键 + CTRL
|
||||||
if (
|
if (window.$KeyboardActive?.ctrl) return
|
||||||
window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
|
||||||
window.$KeyboardActive?.has(MacKeyboard.CTRL_SOURCE_KEY)
|
|
||||||
)
|
|
||||||
return
|
|
||||||
// 判断左右键
|
// 判断左右键
|
||||||
expend.value = !expend.value
|
expend.value = !expend.value
|
||||||
mousedownHandle(e, props.componentGroupData)
|
mousedownHandle(e, props.componentGroupData)
|
||||||
@ -157,11 +153,7 @@ const groupMousedownHandle = (e: MouseEvent) => {
|
|||||||
onClickOutSide()
|
onClickOutSide()
|
||||||
// 若此时按下了 CTRL, 表示多选
|
// 若此时按下了 CTRL, 表示多选
|
||||||
const id = props.componentGroupData.id
|
const id = props.componentGroupData.id
|
||||||
if (
|
if (e.buttons === MouseEventButton.LEFT && window.$KeyboardActive?.ctrl) {
|
||||||
e.buttons === MouseEventButton.LEFT &&
|
|
||||||
(window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
|
||||||
window.$KeyboardActive?.has(MacKeyboard.CTRL_SOURCE_KEY))
|
|
||||||
) {
|
|
||||||
// 若已选中,则去除
|
// 若已选中,则去除
|
||||||
if (chartEditStore.targetChart.selectId.includes(id)) {
|
if (chartEditStore.targetChart.selectId.includes(id)) {
|
||||||
const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)
|
const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)
|
||||||
|
@ -166,11 +166,7 @@ const mousedownHandle = (e: MouseEvent, item: CreateComponentType) => {
|
|||||||
onClickOutSide()
|
onClickOutSide()
|
||||||
// 若此时按下了 CTRL, 表示多选
|
// 若此时按下了 CTRL, 表示多选
|
||||||
const id = item.id
|
const id = item.id
|
||||||
if (
|
if (e.buttons === MouseEventButton.LEFT && window.$KeyboardActive?.ctrl) {
|
||||||
e.buttons === MouseEventButton.LEFT &&
|
|
||||||
(window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
|
||||||
window.$KeyboardActive?.has(MacKeyboard.CTRL_SOURCE_KEY))
|
|
||||||
) {
|
|
||||||
// 若已选中,则去除
|
// 若已选中,则去除
|
||||||
if (chartEditStore.targetChart.selectId.includes(id)) {
|
if (chartEditStore.targetChart.selectId.includes(id)) {
|
||||||
const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)
|
const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)
|
||||||
@ -198,7 +194,6 @@ const changeLayerType = (value: LayerModeEnum) => {
|
|||||||
layerMode.value = value
|
layerMode.value = value
|
||||||
chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYER_TYPE, value)
|
chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYER_TYPE, value)
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -107,16 +107,17 @@ const macKeyList: Array<string> = [
|
|||||||
|
|
||||||
// 处理键盘记录
|
// 处理键盘记录
|
||||||
const keyRecordHandle = () => {
|
const keyRecordHandle = () => {
|
||||||
// 初始化清空
|
// 默认赋值
|
||||||
if(window.$KeyboardActive) window.$KeyboardActive = new Set([])
|
window.$KeyboardActive = {
|
||||||
|
ctrl: true
|
||||||
|
}
|
||||||
|
|
||||||
document.onkeydown = (e: KeyboardEvent) => {
|
document.onkeydown = (e: KeyboardEvent) => {
|
||||||
if(window.$KeyboardActive) window.$KeyboardActive.add(e.key.toLocaleLowerCase())
|
if(e.keyCode === 17 && window.$KeyboardActive) window.$KeyboardActive.ctrl = true
|
||||||
else window.$KeyboardActive = new Set([e.key.toLocaleLowerCase()])
|
|
||||||
}
|
}
|
||||||
|
|
||||||
document.onkeyup = (e: KeyboardEvent) => {
|
document.onkeyup = (e: KeyboardEvent) => {
|
||||||
if(window.$KeyboardActive) window.$KeyboardActive.delete(e.key.toLocaleLowerCase())
|
if(e.keyCode === 17 && window.$KeyboardActive) window.$KeyboardActive.ctrl = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
4
types/global.d.ts
vendored
4
types/global.d.ts
vendored
@ -6,7 +6,7 @@ interface Window {
|
|||||||
$t: any
|
$t: any
|
||||||
$vue: any
|
$vue: any
|
||||||
// 键盘按键记录
|
// 键盘按键记录
|
||||||
$KeyboardActive?: Set<string>
|
$KeyboardActive?: { [T: string]: boolean }
|
||||||
}
|
}
|
||||||
|
|
||||||
declare type Recordable<T = any> = Record<string, T>
|
declare type Recordable<T = any> = Record<string, T>
|
||||||
|
Loading…
Reference in New Issue
Block a user