fix: paste list element boundary error

pr675
Hufe921 3 years ago
parent 10ada8cf54
commit 5935eb77d0

@ -3,7 +3,7 @@ import { EDITOR_ELEMENT_COPY_ATTR } from '../../../dataset/constant/Element'
import { ElementType } from '../../../dataset/enum/Element' import { ElementType } from '../../../dataset/enum/Element'
import { IElement } from '../../../interface/Element' import { IElement } from '../../../interface/Element'
import { splitText } from '../../../utils' import { splitText } from '../../../utils'
import { formatElementContext } from '../../../utils/element' import { formatElementContext, getAnchorElement } from '../../../utils/element'
import { CanvasEvent } from '../CanvasEvent' import { CanvasEvent } from '../CanvasEvent'
export function input(data: string, host: CanvasEvent) { export function input(data: string, host: CanvasEvent) {
@ -34,11 +34,8 @@ export function input(data: string, host: CanvasEvent) {
const { startIndex, endIndex } = rangeManager.getRange() const { startIndex, endIndex } = rangeManager.getRange()
// 格式化元素 // 格式化元素
const elementList = draw.getElementList() const elementList = draw.getElementList()
const endElement = elementList[endIndex] const copyElement = getAnchorElement(elementList, endIndex)
const endNextElement = elementList[endIndex + 1] if (!copyElement) return
const copyElement = endElement.value === ZERO && endNextElement
? endNextElement
: endElement
const inputData: IElement[] = splitText(text).map(value => { const inputData: IElement[] = splitText(text).map(value => {
const newElement: IElement = { const newElement: IElement = {
value value

@ -77,7 +77,11 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
const enterText: IElement = { const enterText: IElement = {
value: ZERO value: ZERO
} }
// 标题结尾处回车无需格式化
const endElement = elementList[endIndex]
if (!(endElement.titleId && endElement.titleId !== elementList[endIndex + 1]?.titleId)) {
formatElementContext(elementList, [enterText], startIndex) formatElementContext(elementList, [enterText], startIndex)
}
let curIndex: number let curIndex: number
if (activeControl && !control.isRangInPostfix()) { if (activeControl && !control.isRangInPostfix()) {
curIndex = control.setValue([enterText]) curIndex = control.setValue([enterText])

@ -5,6 +5,7 @@ import { ControlComponent } from '../../dataset/enum/Control'
import { IEditorOption } from '../../interface/Editor' import { IEditorOption } from '../../interface/Editor'
import { IElement } from '../../interface/Element' import { IElement } from '../../interface/Element'
import { IRange, RangeRowArray, RangeRowMap } from '../../interface/Range' import { IRange, RangeRowArray, RangeRowMap } from '../../interface/Range'
import { getAnchorElement } from '../../utils/element'
import { Draw } from '../draw/Draw' import { Draw } from '../draw/Draw'
import { HistoryManager } from '../history/HistoryManager' import { HistoryManager } from '../history/HistoryManager'
import { Listener } from '../listener/Listener' import { Listener } from '../listener/Listener'
@ -219,7 +220,7 @@ export class RangeManager {
if (!this.listener.rangeStyleChange) return if (!this.listener.rangeStyleChange) return
// 结束光标位置 // 结束光标位置
const { endIndex, isCrossRowCol } = this.range const { endIndex, isCrossRowCol } = this.range
let curElement: IElement let curElement: IElement | null
if (isCrossRowCol) { if (isCrossRowCol) {
// 单元格选择以当前表格定位 // 单元格选择以当前表格定位
const originalElementList = this.draw.getOriginalElementList() const originalElementList = this.draw.getOriginalElementList()
@ -229,11 +230,7 @@ export class RangeManager {
const index = ~endIndex ? endIndex : 0 const index = ~endIndex ? endIndex : 0
// 行首以第一个非换行符元素定位 // 行首以第一个非换行符元素定位
const elementList = this.draw.getElementList() const elementList = this.draw.getElementList()
const endElement = elementList[index] curElement = getAnchorElement(elementList, index)
const endNextElement = elementList[index + 1]
curElement = endElement.value === ZERO && endNextElement && endNextElement.value !== ZERO
? endNextElement
: endElement
} }
if (!curElement) return if (!curElement) return
// 选取元素列表 // 选取元素列表

@ -543,15 +543,23 @@ export function isTextLikeElement(element: IElement): boolean {
return !element.type || TEXTLIKE_ELEMENT_TYPE.includes(element.type) return !element.type || TEXTLIKE_ELEMENT_TYPE.includes(element.type)
} }
export function formatElementContext(sourceElementList: IElement[], formatElementList: IElement[], anchorIndex: number) { export function getAnchorElement(elementList: IElement[], anchorIndex: number): IElement | null {
const anchorElement = sourceElementList[anchorIndex] const anchorElement = elementList[anchorIndex]
const anchorNextElement = sourceElementList[anchorIndex + 1] if (!anchorElement) return null
const copyElement = anchorElement?.value === ZERO && anchorNextElement && anchorNextElement.value !== ZERO const anchorNextElement = elementList[anchorIndex + 1]
// 非列表元素 && 当前元素是换行符 && 下一个元素不是换行符 则以下一个元素作为参考元素
return !anchorElement.listId && anchorElement.value === ZERO && anchorNextElement && anchorNextElement.value !== ZERO
? anchorNextElement ? anchorNextElement
: anchorElement : anchorElement
}
export function formatElementContext(sourceElementList: IElement[], formatElementList: IElement[], anchorIndex: number) {
const copyElement = getAnchorElement(sourceElementList, anchorIndex)
if (!copyElement) return if (!copyElement) return
for (let e = 0; e < formatElementList.length; e++) { for (let e = 0; e < formatElementList.length; e++) {
const targetElement = formatElementList[e] const targetElement = formatElementList[e]
// 定位元素非列表,无需处理粘贴列表的上下文
if (!copyElement.listId && targetElement.type === ElementType.LIST) continue
if (targetElement.valueList && targetElement.valueList.length) { if (targetElement.valueList && targetElement.valueList.length) {
formatElementContext(sourceElementList, targetElement.valueList, anchorIndex) formatElementContext(sourceElementList, targetElement.valueList, anchorIndex)
} }

@ -1097,13 +1097,13 @@ window.onload = function () {
// 列表 // 列表
listOptionDom.querySelectorAll<HTMLLIElement>('li').forEach(li => li.classList.remove('active')) listOptionDom.querySelectorAll<HTMLLIElement>('li').forEach(li => li.classList.remove('active'))
if (payload.listType) { if (payload.listType) {
listDom.classList.add('active')
const listType = payload.listType const listType = payload.listType
const listStyle = payload.listType === ListType.OL ? ListStyle.DECIMAL : payload.listType const listStyle = payload.listType === ListType.OL ? ListStyle.DECIMAL : payload.listType
const curListDom = listOptionDom const curListDom = listOptionDom
.querySelector<HTMLLIElement>(`[data-list-type='${listType}'][data-list-style='${listStyle}']`) .querySelector<HTMLLIElement>(`[data-list-type='${listType}'][data-list-style='${listStyle}']`)
if (curListDom) { if (curListDom) {
curListDom.classList.add('active') curListDom.classList.add('active')
listDom.classList.add('active')
} }
} else { } else {
listDom.classList.remove('active') listDom.classList.remove('active')

Loading…
Cancel
Save