feat: add control deletable rule #301
This commit is contained in:
@@ -81,6 +81,7 @@ interface IElement {
|
|||||||
minWidth?: number;
|
minWidth?: number;
|
||||||
underline?: boolean;
|
underline?: boolean;
|
||||||
extension?: unknown;
|
extension?: unknown;
|
||||||
|
deletable?: boolean;
|
||||||
code: string | null;
|
code: string | null;
|
||||||
min?: number;
|
min?: number;
|
||||||
max?: number;
|
max?: number;
|
||||||
|
|||||||
@@ -81,6 +81,7 @@ interface IElement {
|
|||||||
minWidth?: number;
|
minWidth?: number;
|
||||||
underline?: boolean;
|
underline?: boolean;
|
||||||
extension?: unknown;
|
extension?: unknown;
|
||||||
|
deletable?: boolean;
|
||||||
code: string | null;
|
code: string | null;
|
||||||
min?: number;
|
min?: number;
|
||||||
max?: number;
|
max?: number;
|
||||||
|
|||||||
@@ -1945,6 +1945,7 @@ export class CommandAdapt {
|
|||||||
// 删除控件
|
// 删除控件
|
||||||
const control = this.draw.getControl()
|
const control = this.draw.getControl()
|
||||||
const newIndex = control.removeControl(startIndex)
|
const newIndex = control.removeControl(startIndex)
|
||||||
|
if (newIndex === null) return
|
||||||
// 重新渲染
|
// 重新渲染
|
||||||
this.range.setRange(newIndex, newIndex)
|
this.range.setRange(newIndex, newIndex)
|
||||||
this.draw.render({
|
this.draw.render({
|
||||||
|
|||||||
@@ -301,9 +301,11 @@ export class Control {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public removeControl(startIndex: number): number {
|
public removeControl(startIndex: number): number | null {
|
||||||
const elementList = this.getElementList()
|
const elementList = this.getElementList()
|
||||||
const startElement = elementList[startIndex]
|
const startElement = elementList[startIndex]
|
||||||
|
const { deletable = true } = startElement.control!
|
||||||
|
if (!deletable) return null
|
||||||
let leftIndex = -1
|
let leftIndex = -1
|
||||||
let rightIndex = -1
|
let rightIndex = -1
|
||||||
// 向左查找
|
// 向左查找
|
||||||
@@ -395,7 +397,7 @@ export class Control {
|
|||||||
return this.activeControl.setValue(data)
|
return this.activeControl.setValue(data)
|
||||||
}
|
}
|
||||||
|
|
||||||
public keydown(evt: KeyboardEvent): number {
|
public keydown(evt: KeyboardEvent): number | null {
|
||||||
if (!this.activeControl) {
|
if (!this.activeControl) {
|
||||||
throw new Error('active control is null')
|
throw new Error('active control is null')
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ export class CheckboxControl implements IControlInstance {
|
|||||||
control!.code = data.join(',')
|
control!.code = data.join(',')
|
||||||
}
|
}
|
||||||
|
|
||||||
public keydown(evt: KeyboardEvent): number {
|
public keydown(evt: KeyboardEvent): number | null {
|
||||||
const range = this.control.getRange()
|
const range = this.control.getRange()
|
||||||
// 收缩边界到Value内
|
// 收缩边界到Value内
|
||||||
this.control.shrinkBoundary()
|
this.control.shrinkBoundary()
|
||||||
|
|||||||
@@ -78,7 +78,7 @@ export class SelectControl implements IControlInstance {
|
|||||||
return -1
|
return -1
|
||||||
}
|
}
|
||||||
|
|
||||||
public keydown(evt: KeyboardEvent): number {
|
public keydown(evt: KeyboardEvent): number | null {
|
||||||
const elementList = this.control.getElementList()
|
const elementList = this.control.getElementList()
|
||||||
const range = this.control.getRange()
|
const range = this.control.getRange()
|
||||||
// 收缩边界到Value内
|
// 收缩边界到Value内
|
||||||
|
|||||||
@@ -108,7 +108,7 @@ export class TextControl implements IControlInstance {
|
|||||||
return startIndex
|
return startIndex
|
||||||
}
|
}
|
||||||
|
|
||||||
public keydown(evt: KeyboardEvent): number {
|
public keydown(evt: KeyboardEvent): number | null {
|
||||||
const elementList = this.control.getElementList()
|
const elementList = this.control.getElementList()
|
||||||
const range = this.control.getRange()
|
const range = this.control.getRange()
|
||||||
// 收缩边界到Value内
|
// 收缩边界到Value内
|
||||||
|
|||||||
@@ -28,7 +28,7 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
|
|||||||
const activeControl = control.getActiveControl()
|
const activeControl = control.getActiveControl()
|
||||||
if (evt.key === KeyMap.Backspace) {
|
if (evt.key === KeyMap.Backspace) {
|
||||||
if (isReadonly || isPartRangeInControlOutside) return
|
if (isReadonly || isPartRangeInControlOutside) return
|
||||||
let curIndex: number
|
let curIndex: number | null
|
||||||
if (activeControl) {
|
if (activeControl) {
|
||||||
curIndex = control.keydown(evt)
|
curIndex = control.keydown(evt)
|
||||||
} else {
|
} else {
|
||||||
@@ -58,11 +58,12 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
|
|||||||
}
|
}
|
||||||
curIndex = isCollapsed ? index - 1 : startIndex
|
curIndex = isCollapsed ? index - 1 : startIndex
|
||||||
}
|
}
|
||||||
|
if (curIndex === null) return
|
||||||
rangeManager.setRange(curIndex, curIndex)
|
rangeManager.setRange(curIndex, curIndex)
|
||||||
draw.render({ curIndex })
|
draw.render({ curIndex })
|
||||||
} else if (evt.key === KeyMap.Delete) {
|
} else if (evt.key === KeyMap.Delete) {
|
||||||
if (isReadonly || isPartRangeInControlOutside) return
|
if (isReadonly || isPartRangeInControlOutside) return
|
||||||
let curIndex: number
|
let curIndex: number | null
|
||||||
if (activeControl) {
|
if (activeControl) {
|
||||||
curIndex = control.keydown(evt)
|
curIndex = control.keydown(evt)
|
||||||
} else if (elementList[endIndex + 1]?.type === ElementType.CONTROL) {
|
} else if (elementList[endIndex + 1]?.type === ElementType.CONTROL) {
|
||||||
@@ -79,6 +80,7 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
|
|||||||
}
|
}
|
||||||
curIndex = isCollapsed ? index : startIndex
|
curIndex = isCollapsed ? index : startIndex
|
||||||
}
|
}
|
||||||
|
if (curIndex === null) return
|
||||||
rangeManager.setRange(curIndex, curIndex)
|
rangeManager.setRange(curIndex, curIndex)
|
||||||
draw.render({ curIndex })
|
draw.render({ curIndex })
|
||||||
} else if (evt.key === KeyMap.Enter) {
|
} else if (evt.key === KeyMap.Enter) {
|
||||||
|
|||||||
@@ -21,6 +21,10 @@ export interface IControlCheckbox {
|
|||||||
checkbox?: ICheckbox
|
checkbox?: ICheckbox
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface IControlRule {
|
||||||
|
deletable?: boolean
|
||||||
|
}
|
||||||
|
|
||||||
export interface IControlBasic {
|
export interface IControlBasic {
|
||||||
type: ControlType
|
type: ControlType
|
||||||
value: IElement[] | null
|
value: IElement[] | null
|
||||||
@@ -34,6 +38,7 @@ export interface IControlBasic {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export type IControl = IControlBasic &
|
export type IControl = IControlBasic &
|
||||||
|
IControlRule &
|
||||||
Partial<IControlSelect> &
|
Partial<IControlSelect> &
|
||||||
Partial<IControlCheckbox>
|
Partial<IControlCheckbox>
|
||||||
|
|
||||||
@@ -63,7 +68,7 @@ export interface IControlInstance {
|
|||||||
|
|
||||||
setValue(data: IElement[]): number
|
setValue(data: IElement[]): number
|
||||||
|
|
||||||
keydown(evt: KeyboardEvent): number
|
keydown(evt: KeyboardEvent): number | null
|
||||||
|
|
||||||
cut(): number
|
cut(): number
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user