feat: add deletable and disabled attributes for table td #724

Hufe921 · Sep 1, 2024 · 753510b · 753510b
1 parent 0074781
commit 753510b
Show file tree

Hide file tree

Showing 5 changed files with 58 additions and 29 deletions.
diff --git a/docs/en/guide/schema.md b/docs/en/guide/schema.md
@@ -58,6 +58,8 @@ interface IElement {
   trList?: {
     height: number;
     pagingRepeat?: boolean;
+    extension?: unknown;
+    externalId?: string;
     tdList: {
       colspan: number;
       rowspan: number;
@@ -67,6 +69,10 @@ interface IElement {
       borderTypes?: TdBorder[];
       slashTypes?: TdSlash[];
       value: IElement[];
+      extension?: unknown;
+      externalId?: string;
+      disabled?: boolean;
+      deletable?: boolean;
     }[];
   }[];
   borderType?: TableBorder;

diff --git a/docs/guide/schema.md b/docs/guide/schema.md
@@ -58,6 +58,8 @@ interface IElement {
   trList?: {
     height: number;
     pagingRepeat?: boolean;
+    extension?: unknown;
+    externalId?: string;
     tdList: {
       colspan: number;
       rowspan: number;
@@ -67,6 +69,10 @@ interface IElement {
       borderTypes?: TdBorder[];
       slashTypes?: TdSlash[];
       value: IElement[];
+      extension?: unknown;
+      externalId?: string;
+      disabled?: boolean;
+      deletable?: boolean;
     }[];
   }[];
   borderType?: TableBorder;

diff --git a/src/editor/core/command/CommandAdapt.ts b/src/editor/core/command/CommandAdapt.ts
@@ -143,8 +143,8 @@ export class CommandAdapt {
   }
 
   public cut() {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     this.canvasEvent.cut()
   }
 
@@ -153,8 +153,8 @@ export class CommandAdapt {
   }
 
   public paste(payload?: IPasteOption) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     pasteByApi(this.canvasEvent, payload)
   }
 
@@ -163,8 +163,8 @@ export class CommandAdapt {
   }
 
   public backspace() {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const elementList = this.draw.getElementList()
     const { startIndex, endIndex } = this.range.getRange()
     const isCollapsed = startIndex === endIndex
@@ -697,8 +697,8 @@ export class CommandAdapt {
   }
 
   public title(payload: TitleLevel | null) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const { startIndex, endIndex } = this.range.getRange()
     if (!~startIndex && !~endIndex) return
     const elementList = this.draw.getElementList()
@@ -775,8 +775,8 @@ export class CommandAdapt {
   }
 
   public insertTable(row: number, col: number) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const activeControl = this.control.getActiveControl()
     if (activeControl) return
     const { startIndex, endIndex } = this.range.getRange()
@@ -1573,8 +1573,8 @@ export class CommandAdapt {
   }
 
   public hyperlink(payload: IElement) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const activeControl = this.control.getActiveControl()
     if (activeControl) return
     const { startIndex, endIndex } = this.range.getRange()
@@ -1641,8 +1641,8 @@ export class CommandAdapt {
   }
 
   public deleteHyperlink() {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     // 获取超链接索引
     const hyperRange = this.getHyperlinkRange()
     if (!hyperRange) return
@@ -1664,8 +1664,8 @@ export class CommandAdapt {
   }
 
   public cancelHyperlink() {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     // 获取超链接索引
     const hyperRange = this.getHyperlinkRange()
     if (!hyperRange) return
@@ -1689,8 +1689,8 @@ export class CommandAdapt {
   }
 
   public editHyperlink(payload: string) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     // 获取超链接索引
     const hyperRange = this.getHyperlinkRange()
     if (!hyperRange) return
@@ -1711,8 +1711,8 @@ export class CommandAdapt {
   }
 
   public separator(payload: number[]) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const activeControl = this.control.getActiveControl()
     if (activeControl) return
     const { startIndex, endIndex } = this.range.getRange()
@@ -1753,8 +1753,8 @@ export class CommandAdapt {
   }
 
   public pageBreak() {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const activeControl = this.control.getActiveControl()
     if (activeControl) return
     this.insertElementList([
@@ -2237,8 +2237,8 @@ export class CommandAdapt {
 
   public insertElementList(payload: IElement[]) {
     if (!payload.length) return
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const cloneElementList = deepClone(payload)
     // 格式化上下文信息
     const { startIndex } = this.range.getRange()
@@ -2568,8 +2568,8 @@ export class CommandAdapt {
   }
 
   public insertControl(payload: IElement) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const cloneElement = deepClone(payload)
     // 格式化上下文信息
     const { startIndex } = this.range.getRange()
@@ -2716,8 +2716,8 @@ export class CommandAdapt {
   }
 
   public insertTitle(payload: IElement) {
-    const isReadonly = this.draw.isReadonly()
-    if (isReadonly) return
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
+    if (isDisabled) return
     const cloneElement = deepClone(payload)
     // 格式化上下文信息
     const { startIndex } = this.range.getRange()

diff --git a/src/editor/core/draw/Draw.ts b/src/editor/core/draw/Draw.ts
@@ -103,6 +103,7 @@ import { LineBreakParticle } from './particle/LineBreakParticle'
 import { MouseObserver } from '../observer/MouseObserver'
 import { LineNumber } from './frame/LineNumber'
 import { PageBorder } from './frame/PageBorder'
+import { ITd } from '../../interface/table/Td'
 
 export class Draw {
   private container: HTMLDivElement
@@ -330,6 +331,8 @@ export class Draw {
     if (this.mode === EditorMode.DESIGN) return false
     const { startIndex, endIndex } = this.range.getRange()
     const elementList = this.getElementList()
+    // 优先判断表格单元格
+    if (this.getTd()?.disabled) return true
     if (startIndex === endIndex) {
       const startElement = elementList[startIndex]
       const nextElement = elementList[startIndex + 1]
@@ -625,6 +628,16 @@ export class Draw {
     return this.footer.getElementList()
   }
 
+  public getTd(): ITd | null {
+    const positionContext = this.position.getPositionContext()
+    const { index, trIndex, tdIndex, isTable } = positionContext
+    if (isTable) {
+      const elementList = this.getOriginalElementList()
+      return elementList[index!].trList![trIndex!].tdList[tdIndex!]
+    }
+    return null
+  }
+
   public insertElementList(payload: IElement[]) {
     if (!payload.length || !this.range.getIsCanInput()) return
     const { startIndex, endIndex } = this.range.getRange()
@@ -732,12 +745,14 @@ export class Draw {
       }
       // 元素删除（不可删除控件忽略）
       if (!this.control.getActiveControl()) {
+        const tdDeletable = this.getTd()?.deletable
         let deleteIndex = endIndex - 1
         while (deleteIndex >= start) {
           const deleteElement = elementList[deleteIndex]
           if (
             isDesignMode ||
-            (deleteElement?.control?.deletable !== false &&
+            (tdDeletable !== false &&
+              deleteElement?.control?.deletable !== false &&
               deleteElement?.title?.deletable !== false)
           ) {
             elementList.splice(deleteIndex, 1)

diff --git a/src/editor/interface/table/Td.ts b/src/editor/interface/table/Td.ts
@@ -31,4 +31,6 @@ export interface ITd {
   mainHeight?: number // 内容 + 内边距高度
   realHeight?: number // 真实高度（包含跨列）
   realMinHeight?: number // 真实最小高度（包含跨列）
+  disabled?: boolean // 内容不可编辑
+  deletable?: boolean // 内容不可删除
 }