-
-
Notifications
You must be signed in to change notification settings - Fork 3.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
f691c4b
commit a397116
Showing
12 changed files
with
380 additions
and
15 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,92 @@ | ||
| /** | ||
| * @description del col menu | ||
| * @author wangfupeng | ||
| */ | ||
|
|
||
| import { isEqual } from 'lodash-es' | ||
| import { Editor, Transforms, Range, Node } from 'slate' | ||
| import { IButtonMenu, IDomEditor, DomEditor } from '@wangeditor/core' | ||
| import { getSelectedNodeByType } from '../_helpers/node' | ||
| import { DEL_COL_SVG } from '../../constants/svg' | ||
|
|
||
| class DeleteCol implements IButtonMenu { | ||
| title = '删除列' | ||
| iconSvg = DEL_COL_SVG | ||
| tag = 'button' | ||
|
|
||
| getValue(editor: IDomEditor): string | boolean { | ||
| // 无需获取 val | ||
| return '' | ||
| } | ||
|
|
||
| isActive(editor: IDomEditor): boolean { | ||
| // 无需 active | ||
| return false | ||
| } | ||
|
|
||
| isDisabled(editor: IDomEditor): boolean { | ||
| const { selection } = editor | ||
| if (selection == null) return true | ||
| if (!Range.isCollapsed(selection)) return true | ||
|
|
||
| const cellNode = getSelectedNodeByType(editor, 'table-cell') | ||
| if (cellNode == null) { | ||
| // 选区未处于 table cell node ，则禁用 | ||
| return true | ||
| } | ||
| return false | ||
| } | ||
|
|
||
| exec(editor: IDomEditor, value: string | boolean) { | ||
| if (this.isDisabled(editor)) return | ||
|
|
||
| const [cellEntry] = Editor.nodes(editor, { | ||
| // @ts-ignore | ||
| match: n => n.type === 'table-cell', | ||
| universal: true, | ||
| }) | ||
| const [selectedCellNode, selectedCellPath] = cellEntry | ||
|
|
||
| // 如果只有一列，则删除整个表格 | ||
| const rowNode = DomEditor.getParentNode(editor, selectedCellNode) | ||
| const colLength = rowNode?.children.length || 0 | ||
| if (!rowNode || colLength <= 1) { | ||
| Transforms.removeNodes(editor, { mode: 'highest' }) // 删除整个表格 | ||
| return | ||
| } | ||
|
|
||
| // ------------------------- 不只有 1 列，则继续 ------------------------- | ||
|
|
||
| // 【注意】临时记录 tableNode path ，重要！！！ 执行完之后再删除 | ||
| // 这样做，可以避免被 normalize 误伤 | ||
| const selectedTablePath = selectedCellPath.slice(0, 1) | ||
| DomEditor.recordChangingPath(editor, selectedTablePath) | ||
|
|
||
| const tableNode = DomEditor.getParentNode(editor, rowNode) | ||
| if (tableNode == null) return | ||
|
|
||
| // 遍历所有 rows ，挨个删除 cell | ||
| const rows = tableNode.children || [] | ||
| rows.forEach(row => { | ||
| // @ts-ignore | ||
| const cells = row.children || [] | ||
| // 遍历一个 row 的所有 cells | ||
| cells.forEach((cell: Node) => { | ||
| const path = DomEditor.findPath(editor, cell) | ||
| if ( | ||
| path.length === selectedCellPath.length && | ||
| isEqual(path.slice(-1), selectedCellPath.slice(-1)) // 俩数组，最后一位相同 | ||
| ) { | ||
| // 如果当前 td 的 path 和选中 td 的 path ，最后一位相同，说明是同一列 | ||
| // 删除当前的 cell | ||
| Transforms.removeNodes(editor, { at: path }) | ||
| } | ||
| }) | ||
| }) | ||
|
|
||
| // 及时删除记录，重要！！！ | ||
| DomEditor.deleteChangingPath(editor) | ||
| } | ||
| } | ||
|
|
||
| export default DeleteCol |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,62 @@ | ||
| /** | ||
| * @description del row menu | ||
| * @author wangfupeng | ||
| */ | ||
|
|
||
| import { Editor, Transforms, Range } from 'slate' | ||
| import { IButtonMenu, IDomEditor, DomEditor } from '@wangeditor/core' | ||
| import { getSelectedNodeByType } from '../_helpers/node' | ||
| import { DEL_ROW_SVG } from '../../constants/svg' | ||
|
|
||
| class DeleteRow implements IButtonMenu { | ||
| title = '删除行' | ||
| iconSvg = DEL_ROW_SVG | ||
| tag = 'button' | ||
|
|
||
| getValue(editor: IDomEditor): string | boolean { | ||
| // 无需获取 val | ||
| return '' | ||
| } | ||
|
|
||
| isActive(editor: IDomEditor): boolean { | ||
| // 无需 active | ||
| return false | ||
| } | ||
|
|
||
| isDisabled(editor: IDomEditor): boolean { | ||
| const { selection } = editor | ||
| if (selection == null) return true | ||
| if (!Range.isCollapsed(selection)) return true | ||
|
|
||
| const rowNode = getSelectedNodeByType(editor, 'table-row') | ||
| if (rowNode == null) { | ||
| // 选区未处于 table row node ，则禁用 | ||
| return true | ||
| } | ||
| return false | ||
| } | ||
|
|
||
| exec(editor: IDomEditor, value: string | boolean) { | ||
| if (this.isDisabled(editor)) return | ||
|
|
||
| const [rowEntry] = Editor.nodes(editor, { | ||
| // @ts-ignore | ||
| match: n => n.type === 'table-row', | ||
| universal: true, | ||
| }) | ||
| const [rowNode, rowPath] = rowEntry | ||
|
|
||
| const tableNode = DomEditor.getParentNode(editor, rowNode) | ||
| const rowsLength = tableNode?.children.length || 0 | ||
| if (rowsLength <= 1) { | ||
| // row 只有一行，则删掉整个表格 | ||
| Transforms.removeNodes(editor, { mode: 'highest' }) | ||
| return | ||
| } | ||
|
|
||
| // row > 1 行，则删掉这一行 | ||
| Transforms.removeNodes(editor, { at: rowPath }) | ||
| } | ||
| } | ||
|
|
||
| export default DeleteRow |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,85 @@ | ||
| /** | ||
| * @description insert col menu | ||
| * @author wangfupeng | ||
| */ | ||
|
|
||
| import { isEqual } from 'lodash-es' | ||
| import { Editor, Transforms, Range, Node } from 'slate' | ||
| import { IButtonMenu, IDomEditor, DomEditor } from '@wangeditor/core' | ||
| import { getSelectedNodeByType } from '../_helpers/node' | ||
| import { ADD_COL_SVG } from '../../constants/svg' | ||
|
|
||
| class InsertCol implements IButtonMenu { | ||
| title = '插入列' | ||
| iconSvg = ADD_COL_SVG | ||
| tag = 'button' | ||
|
|
||
| getValue(editor: IDomEditor): string | boolean { | ||
| // 无需获取 val | ||
| return '' | ||
| } | ||
|
|
||
| isActive(editor: IDomEditor): boolean { | ||
| // 无需 active | ||
| return false | ||
| } | ||
|
|
||
| isDisabled(editor: IDomEditor): boolean { | ||
| const { selection } = editor | ||
| if (selection == null) return true | ||
| if (!Range.isCollapsed(selection)) return true | ||
|
|
||
| const tableNode = getSelectedNodeByType(editor, 'table') | ||
| if (tableNode == null) { | ||
| // 选区未处于 table cell node ，则禁用 | ||
| return true | ||
| } | ||
| return false | ||
| } | ||
|
|
||
| exec(editor: IDomEditor, value: string | boolean) { | ||
| if (this.isDisabled(editor)) return | ||
|
|
||
| const [cellEntry] = Editor.nodes(editor, { | ||
| // @ts-ignore | ||
| match: n => n.type === 'table-cell', | ||
| universal: true, | ||
| }) | ||
| const [selectedCellNode, selectedCellPath] = cellEntry | ||
|
|
||
| // 【注意】临时记录 tableNode path ，重要！！！ 执行完之后再删除 | ||
| // 这样做，可以避免被 normalize 误伤 | ||
| const selectedTablePath = selectedCellPath.slice(0, 1) | ||
| DomEditor.recordChangingPath(editor, selectedTablePath) | ||
|
|
||
| const rowNode = DomEditor.getParentNode(editor, selectedCellNode) | ||
| if (rowNode == null) return | ||
| const tableNode = DomEditor.getParentNode(editor, rowNode) | ||
| if (tableNode == null) return | ||
|
|
||
| // 遍历所有 rows ，挨个添加 cell | ||
| const rows = tableNode.children || [] | ||
| rows.forEach(row => { | ||
| // @ts-ignore | ||
| const cells = row.children || [] | ||
| // 遍历一个 row 的所有 cells | ||
| cells.forEach((cell: Node) => { | ||
| const path = DomEditor.findPath(editor, cell) | ||
| if ( | ||
| path.length === selectedCellPath.length && | ||
| isEqual(path.slice(-1), selectedCellPath.slice(-1)) // 俩数组，最后一位相同 | ||
| ) { | ||
| // 如果当前 td 的 path 和选中 td 的 path ，最后一位相同，说明是同一列 | ||
| // 则在其后插入一个 cell | ||
| const newCell = { type: 'table-cell', children: [{ text: '' }] } | ||
| Transforms.insertNodes(editor, newCell, { at: path }) | ||
| } | ||
| }) | ||
| }) | ||
|
|
||
| // 及时删除记录，重要！！！ | ||
| DomEditor.deleteChangingPath(editor) | ||
| } | ||
| } | ||
|
|
||
| export default InsertCol |
Oops, something went wrong.