mirror of https://github.com/halo-dev/halo
feat: add select all shortcut function to the table (#5443)
#### What type of PR is this? /area editor /area ui /kind feature /milestone 2.14.x #### What this PR does / why we need it: 为默认富文本编辑器中的表格,增加全选快捷键。具体操作逻辑如下: 1. 当光标处于表格中单元格内时,按 `Mod + a` 全选快捷键后,若未选中当前单元格,则选中单元格。 2. 若其中包含有其他影响全选快捷键的组件,则以组件自身为准,例如代码块中的全选。 3. 若已经选中单元格,则再次按全选快捷键,选中整个表格。 4. 若已经选中表格,则再按全选快捷键不会触发其他全选事件。 #### How to test it? 按照操作逻辑测试全选快捷键逻辑是否无误。是否与其他快捷键产生冲突。 #### Which issue(s) this PR fixes: Fixes #5438 #### Does this PR introduce a user-facing change? ```release-note 为富文本编辑器中的表格组件增加全选快捷键 ```pull/5452/head^2
parent
860f694385
commit
71d97b20c0
|
@ -9,6 +9,7 @@ import {
|
|||
mergeAttributes,
|
||||
isNodeActive,
|
||||
CoreEditor,
|
||||
findParentNode,
|
||||
} from "@/tiptap";
|
||||
import {
|
||||
type Node as ProseMirrorNode,
|
||||
|
@ -36,7 +37,12 @@ import { markRaw } from "vue";
|
|||
import { i18n } from "@/locales";
|
||||
import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
|
||||
import { BlockActionSeparator, ToolboxItem } from "@/components";
|
||||
import { hasTableBefore, isTableSelected } from "./util";
|
||||
import {
|
||||
hasTableBefore,
|
||||
isCellSelection,
|
||||
isTableSelected,
|
||||
selectTable,
|
||||
} from "./util";
|
||||
|
||||
function updateColumns(
|
||||
node: ProseMirrorNode,
|
||||
|
@ -484,6 +490,38 @@ const Table = TiptapTable.extend<ExtensionOptions & TableOptions>({
|
|||
Backspace: () => handleBackspace(),
|
||||
|
||||
"Mod-Backspace": () => handleBackspace(),
|
||||
|
||||
"Mod-a": ({ editor }) => {
|
||||
if (!isNodeActive(editor.state, Table.name)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const { tr, selection } = editor.state;
|
||||
// If the entire table is already selected, no longer perform the select all operation.
|
||||
if (isTableSelected(selection)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (isCellSelection(selection)) {
|
||||
selectTable(tr);
|
||||
editor.view.dispatch(tr);
|
||||
return true;
|
||||
}
|
||||
|
||||
let cellNodePos = findParentNode(
|
||||
(node) => node.type.name === TableCell.name
|
||||
)(selection);
|
||||
if (!cellNodePos) {
|
||||
cellNodePos = findParentNode(
|
||||
(node) => node.type.name === TableHeader.name
|
||||
)(selection);
|
||||
}
|
||||
if (!cellNodePos) {
|
||||
return false;
|
||||
}
|
||||
editor.commands.setNodeSelection(cellNodePos.pos);
|
||||
return true;
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
|
|
Loading…
Reference in New Issue