feat: add Table Props[columnWidths] & toHTML add display:none

cycleccc · Jul 9, 2024 · 4956621 · 4956621
1 parent 26250fa
commit 4956621
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 6 deletions.
diff --git a/packages/table-module/src/module/column-resize.ts b/packages/table-module/src/module/column-resize.ts
@@ -1,6 +1,6 @@
 import throttle from 'lodash.throttle'
 import { Element as SlateElement, Transforms, Editor } from 'slate'
-import { DomEditor, IDomEditor } from '@wangeditor/core'
+import { DomEditor, IDomEditor } from '@wangeditor-next/core'
 import { TableElement } from './custom-types'
 import { isOfType } from '../utils'
 import $ from '../utils/dom'

diff --git a/packages/table-module/src/module/elem-to-html.ts b/packages/table-module/src/module/elem-to-html.ts
@@ -9,7 +9,7 @@ import { TableCellElement, TableRowElement, TableElement } from './custom-types'
 function tableToHtml(elemNode: Element, childrenHtml: string): string {
   const { width = 'auto' } = elemNode as TableElement
 
-  return `<table style="width: ${width};"><tbody>${childrenHtml}</tbody></table>`
+  return `<table style="width: ${width};table-layout: fixed;"><tbody>${childrenHtml}</tbody></table>`
 }
 
 function tableRowToHtml(elem: Element, childrenHtml: string): string {
@@ -22,9 +22,11 @@ function tableCellToHtml(cellNode: Element, childrenHtml: string): string {
     rowSpan = 1,
     isHeader = false,
     width = 'auto',
+    hidden = false
   } = cellNode as TableCellElement
   const tag = isHeader ? 'th' : 'td'
-  return `<${tag} colSpan="${colSpan}" rowSpan="${rowSpan}" width="${width}">${childrenHtml}</${tag}>`
+  const style = hidden ? 'display:none' : ''
+  return `<${tag} colSpan="${colSpan}" rowSpan="${rowSpan}" width="${width}" style="${style}">${childrenHtml}</${tag}>`
 }
 
 export const tableToHtmlConf = {

diff --git a/packages/table-module/src/module/menu/InsertCol.ts b/packages/table-module/src/module/menu/InsertCol.ts
@@ -8,7 +8,6 @@ import { IButtonMenu, IDomEditor, DomEditor, t } from '@wangeditor-next/core'
 import { ADD_COL_SVG } from '../../constants/svg'
 import { TableCellElement, TableElement } from '../custom-types'
 import { isTableWithHeader } from '../helpers'
-import { isTableWithHeader } from '../helpers'
 import { filledMatrix } from '../../utils'
 
 class InsertCol implements IButtonMenu {

diff --git a/packages/table-module/src/module/menu/InsertTable.ts b/packages/table-module/src/module/menu/InsertTable.ts
@@ -13,6 +13,7 @@ import { TableElement, TableCellElement, TableRowElement } from '../custom-types
 function genTableNode(rowNum: number, colNum: number): TableElement {
   // 拼接 rows
   const rows: TableRowElement[] = []
+  const columnWidths: number[] = Array(colNum).fill(60)
   for (let i = 0; i < rowNum; i++) {
     // 拼接 cells
     const cells: TableCellElement[] = []
@@ -38,6 +39,7 @@ function genTableNode(rowNum: number, colNum: number): TableElement {
     type: 'table',
     width: 'auto',
     children: rows,
+    columnWidths
   }
 }
 

diff --git a/packages/table-module/src/module/menu/MergeCell.ts b/packages/table-module/src/module/menu/MergeCell.ts
@@ -1,5 +1,5 @@
 import { Editor, Path, Transforms, Node } from 'slate'
-import { IButtonMenu, IDomEditor, t } from '@wangeditor/core'
+import { IButtonMenu, IDomEditor, t } from '@wangeditor-next/core'
 import { MERGE_CELL_SVG } from '../../constants/svg'
 import { EDITOR_TO_SELECTION } from '../weak-maps'
 import { TableCursor } from '../table-cursor'

diff --git a/packages/table-module/src/module/menu/SplitCell.ts b/packages/table-module/src/module/menu/SplitCell.ts
@@ -1,5 +1,5 @@
 import { Editor, Path, Transforms } from 'slate'
-import { IButtonMenu, IDomEditor, t } from '@wangeditor/core'
+import { IButtonMenu, IDomEditor, t } from '@wangeditor-next/core'
 import { SPLIT_CELL_SVG } from '../../constants/svg'
 import { EDITOR_TO_SELECTION } from '../weak-maps'
 import { filledMatrix, isOfType, CellElement } from '../../utils'