lsadmin/canvas-editor_fex765
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: support for insert more elements into control #306

Browse Source
This commit is contained in:
Hufe921
2023-11-03 21:23:52 +08:00
parent 7fb0150635
commit d2d649b011
12 changed files with 38 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/editor/core/command/CommandAdapt.ts
+1 -5
View File
@@ -366,8 +366,6 @@ export class CommandAdapt {
public superscript() {
const isReadonly = this.draw.isReadonly()
if (isReadonly) return
const activeControl = this.control.getActiveControl()
if (activeControl) return
const selection = this.range.getSelectionElementList()
if (!selection) return
const superscriptIndex = selection.findIndex(
@@ -397,8 +395,6 @@ export class CommandAdapt {
public subscript() {
const isReadonly = this.draw.isReadonly()
if (isReadonly) return
const activeControl = this.control.getActiveControl()
if (activeControl) return
const selection = this.range.getSelectionElementList()
if (!selection) return
const subscriptIndex = selection.findIndex(
@@ -1947,7 +1943,7 @@ export class CommandAdapt {
if (startIndex !== endIndex) return
const elementList = this.draw.getElementList()
const element = elementList[startIndex]
if (element.type !== ElementType.CONTROL) return
if (!element.controlId) return
// 删除控件
const control = this.draw.getControl()
const newIndex = control.removeControl(startIndex)
src/editor/core/contextmenu/menus/controlMenus.ts
+1 -2
View File
@@ -1,5 +1,4 @@
import { INTERNAL_CONTEXT_MENU_KEY } from '../../../dataset/constant/ContextMenu'
import { ElementType } from '../../../dataset/enum/Element'
import { IRegisterContextMenu } from '../../../interface/contextmenu/ContextMenu'
import { Command } from '../../command/Command'
const {
@@ -14,7 +13,7 @@ export const controlMenus: IRegisterContextMenu[] = [
return (
!payload.isReadonly &&
!payload.editorHasSelection &&
payload.startElement?.type === ElementType.CONTROL
!!payload.startElement?.controlId
)
},
callback: (command: Command) => {
src/editor/core/draw/control/Control.ts
+5 -7
View File
@@ -68,7 +68,7 @@ export class Control {
}
}
}
if (element.type !== ElementType.CONTROL || element.control?.minWidth) {
if (!element.controlId || element.control?.minWidth) {
return true
}
return (
@@ -87,8 +87,7 @@ export class Control {
const startElement = elementList[startIndex]
const endElement = elementList[endIndex]
if (
(startElement?.type === ElementType.CONTROL ||
endElement?.type === ElementType.CONTROL) &&
startElement.controlId &&
startElement.controlId !== endElement.controlId
) {
return true
@@ -114,10 +113,9 @@ export class Control {
const startElement = elementList[startIndex]
const endElement = elementList[endIndex]
if (
(startElement.type === ElementType.CONTROL ||
endElement.type === ElementType.CONTROL) &&
endElement.controlComponent !== ControlComponent.POSTFIX &&
startElement.controlId === endElement.controlId
startElement.controlId &&
startElement.controlId === endElement.controlId &&
endElement.controlComponent !== ControlComponent.POSTFIX
) {
return true
}
src/editor/core/draw/control/text/TextControl.ts
+8 -5
View File
@@ -1,4 +1,4 @@
import { EDITOR_ELEMENT_STYLE_ATTR } from '../../../../dataset/constant/Element'
import { TEXTLIKE_ELEMENT_TYPE } from '../../../../dataset/constant/Element'
import { ControlComponent } from '../../../../dataset/enum/Control'
import { KeyMap } from '../../../../dataset/enum/KeyMap'
import {
@@ -6,7 +6,7 @@ import {
IControlInstance
} from '../../../../interface/Control'
import { IElement } from '../../../../interface/Element'
import { omitObject } from '../../../../utils'
import { omitObject, pickObject } from '../../../../utils'
import { formatElementContext } from '../../../../utils/element'
import { Control } from '../Control'
@@ -75,12 +75,15 @@ export class TextControl implements IControlInstance {
// 移除空白占位符
this.control.removePlaceholder(startIndex, context)
}
// 插入
// 非文本类元素或前缀过渡掉样式属性
const startElement = elementList[startIndex]
const anchorElement =
(startElement.type &&
!TEXTLIKE_ELEMENT_TYPE.includes(startElement.type)) ||
startElement.controlComponent === ControlComponent.PREFIX
? omitObject(startElement, EDITOR_ELEMENT_STYLE_ATTR)
: startElement
? pickObject(startElement, ['control', 'controlId'])
: omitObject(startElement, ['type'])
// 插入起始位置
const start = range.startIndex + 1
for (let i = 0; i < data.length; i++) {
const newElement: IElement = {
src/editor/core/event/handlers/keydown.ts
+1 -1
View File
@@ -65,7 +65,7 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
let curIndex: number | null
if (activeControl) {
curIndex = control.keydown(evt)
} else if (elementList[endIndex + 1]?.type === ElementType.CONTROL) {
} else if (elementList[endIndex + 1]?.controlId) {
curIndex = control.removeControl(endIndex + 1)
} else {
if (!isCollapsed) {
src/editor/core/event/handlers/mousedown.ts
+1 -1
View File
@@ -97,7 +97,7 @@ export function mousedown(evt: MouseEvent, host: CanvasEvent) {
// 预览工具组件
const previewer = draw.getPreviewer()
previewer.clearResizer()
if (isDirectHitImage && !isReadonly) {
if (isDirectHitImage) {
previewer.drawResizer(
curElement,
positionList[curIndex],
src/editor/core/event/handlers/mouseup.ts
+4 -6
View File
@@ -50,17 +50,15 @@ export function mouseup(evt: MouseEvent, host: CanvasEvent) {
cacheRange.startIndex + 1,
cacheRange.endIndex + 1
)
const isContainControl = dragElementList.find(
element => element.type === ElementType.CONTROL
)
const isContainControl = dragElementList.find(element => element.controlId)
if (isContainControl) {
// 仅允许 (最前/后元素不是控件 || 在控件前后 || 文本控件且是值) 拖拽
const cacheStartElement = cacheElementList[cacheRange.startIndex + 1]
const cacheEndElement = cacheElementList[cacheRange.endIndex]
const isAllowDragControl =
((cacheStartElement.type !== ElementType.CONTROL ||
((!cacheStartElement.controlId ||
cacheStartElement.controlComponent === ControlComponent.PREFIX) &&
(cacheEndElement.type !== ElementType.CONTROL ||
(!cacheEndElement.controlId ||
cacheEndElement.controlComponent === ControlComponent.POSTFIX)) ||
(cacheStartElement.controlId === cacheEndElement.controlId &&
cacheStartElement.controlComponent === ControlComponent.PREFIX &&
@@ -152,7 +150,7 @@ export function mouseup(evt: MouseEvent, host: CanvasEvent) {
)
const cacheEndElement = cacheElementList[cacheRangeEndIndex]
if (
cacheEndElement.type === ElementType.CONTROL &&
cacheEndElement.controlId &&
cacheEndElement.controlComponent !== ControlComponent.POSTFIX
) {
rangeManager.replaceRange({
src/editor/core/position/Position.ts
+3 -3
View File
@@ -315,7 +315,7 @@ export class Position {
tdValueElement.type === ElementType.CHECKBOX ||
tdValueElement.controlComponent ===
ControlComponent.CHECKBOX,
isControl: tdValueElement.type === ElementType.CONTROL,
isControl: !!tdValueElement.controlId,
isImage: tablePosition.isImage,
isDirectHit: tablePosition.isDirectHit,
isTable: true,
@@ -366,7 +366,7 @@ export class Position {
return {
hitLineStartIndex,
index: curPositionIndex,
isControl: element.type === ElementType.CONTROL
isControl: !!element.controlId
}
}
}
@@ -471,7 +471,7 @@ export class Position {
return {
hitLineStartIndex,
index: curPositionIndex,
isControl: elementList[curPositionIndex]?.type === ElementType.CONTROL
isControl: !!elementList[curPositionIndex]?.controlId
}
}
src/editor/core/range/RangeManager.ts
+1 -1
View File
@@ -275,7 +275,7 @@ export class RangeManager {
if (~startIndex && ~endIndex) {
const elementList = this.draw.getElementList()
const element = elementList[startIndex]
if (element?.type === ElementType.CONTROL) {
if (element?.controlId) {
control.initControl()
return
}
src/editor/core/worker/works/wordCount.ts
+2 -2
View File
@@ -44,7 +44,7 @@ function pickText(elementList: IElement[]): string {
e++
}
text += pickText(valueList)
} else if (element.type === ElementType.CONTROL) {
} else if (element.controlId) {
const controlId = element.controlId
const valueList: IElement[] = []
while (e < elementList.length) {
@@ -54,7 +54,7 @@ function pickText(elementList: IElement[]): string {
break
}
if (controlE.controlComponent === ControlComponent.VALUE) {
delete controlE.type
delete controlE.controlId
valueList.push(controlE)
}
e++
src/editor/utils/element.ts
+10 -4
View File
@@ -538,7 +538,7 @@ export function zipElementList(payload: IElement[]): IElement[] {
}
dateElement.valueList = zipElementList(valueList)
element = dateElement
} else if (element.type === ElementType.CONTROL) {
} else if (element.controlId) {
// 控件处理
const controlId = element.controlId
const control = element.control!
@@ -555,8 +555,8 @@ export function zipElementList(payload: IElement[]): IElement[] {
break
}
if (controlE.controlComponent === ControlComponent.VALUE) {
delete controlE.type
delete controlE.control
delete controlE.controlId
valueList.push(controlE)
}
e++
@@ -837,8 +837,14 @@ export function createDomFromElementList(
TEXTLIKE_ELEMENT_TYPE.includes(element.type)
) {
let text = ''
if (element.type === ElementType.CONTROL) {
text = element.control!.value?.[0]?.value || ''
if (element.controlId) {
text =
element
.control!.value?.filter(
v => !v.type || TEXTLIKE_ELEMENT_TYPE.includes(v.type)
)
.map(v => v.value)
.join('') || ''
} else if (element.type === ElementType.DATE) {
text = element.valueList?.map(v => v.value).join('') || ''
} else {