@hailin-zheng/editor-core 2.0.14 → 2.0.16

package/index.js

@@ -2741,6 +2741,7 @@ class DataDecorateElement extends LeafElement {
                 }
             }
         });
+        this.disableClick = !isPrefix;
         this.isDecorate = true;
     }
     createRenderObject() {
@@ -3358,7 +3359,6 @@ class DocumentRenderObject extends BlockContainerRenderObject {
                     'font-family': '仿宋',
                     'font-size': '14',
                     "fill": this.element.props.color,
-                    'font-style': 'italic',
                     x: 0,
                     y: 0,
                 }
@@ -4249,7 +4249,7 @@ class PSymbolElement extends LeafElement {
     createRenderObject() {
         const symbol = new PSymbolRenderObject(this);
         symbol.rect.height = this.defaultHeight;
-        symbol.rect.width = 7;
+        symbol.rect.width = 1;
         return symbol;
     }
     serialize() {
@@ -4780,45 +4780,27 @@ class TextGroupRenderObject extends LeafRenderObject {
         if (this.element.props.background) {
             const bgX = event.relativePagePos.x;
             const bgY = event.relativePagePos.y;
-            event.highlights.push({
-                sel: 'path',
-                data: {
-                    ns: "http://www.w3.org/2000/svg",
-                    attrs: {
-                        d: `M${bgX} ${bgY} h${width} v${this.rect.height} h-${width}z`,
-                        fill: this.element.props.background,
-                    }
-                }
-            });
+            event.highlights.push(ElementUtil.getFillSvgRect(bgX, bgY, this.rect.width, this.rect.height, this.element.props.background));
         }
         if (this.element.props.underline) {
             const underHeight = this.element.props.fontSize * 1.2;
-            event.highlights.push({
-                sel: 'path',
-                data: {
-                    ns: "http://www.w3.org/2000/svg",
-                    attrs: {
-                        d: `M${event.relativePagePos.x} ${event.relativePagePos.y + underHeight} L${event.relativePagePos.x + this.rect.width} ${event.relativePagePos.y + underHeight}`,
-                        stroke: '#000',
-                        'stroke-width': 1,
-                        fill: 'none'
-                    }
-                }
-            });
+            const path = `M${event.relativePagePos.x} ${event.relativePagePos.y + underHeight} L${event.relativePagePos.x + this.rect.width} ${event.relativePagePos.y + underHeight}`;
+            event.highlights.push(ElementUtil.getStrokeSvgPath(path, '#000', 1));
         }
         if (this.element.props.linethrough) {
-            event.highlights.push({
-                sel: 'path',
-                data: {
-                    ns: "http://www.w3.org/2000/svg",
-                    attrs: {
-                        d: `M${event.relativePagePos.x} ${event.relativePagePos.y + this.rect.height / 2} L${event.relativePagePos.x + this.rect.width} ${event.relativePagePos.y + this.rect.height / 2}`,
-                        stroke: '#000',
-                        'stroke-width': 1,
-                        fill: 'none'
-                    }
-                }
-            });
+            const path = `M${event.relativePagePos.x} ${event.relativePagePos.y + this.rect.height / 2} L${event.relativePagePos.x + this.rect.width} ${event.relativePagePos.y + this.rect.height / 2}`;
+            event.highlights.push(ElementUtil.getStrokeSvgPath(path, '#000', 1));
+        }
+        if (this.element.props.border) {
+            event.highlights.push(ElementUtil.getStrokeSvgPath(ElementUtil.getRectPath(event.relativePagePos.x, event.relativePagePos.y, this.rect.width, this.rect.height), '#000', 1));
+        }
+        if (this.element.props.overline) {
+            const path = `M${event.relativePagePos.x} ${event.relativePagePos.y} L${event.relativePagePos.x + this.rect.width} ${event.relativePagePos.y}`;
+            event.highlights.push(ElementUtil.getStrokeSvgPath(path, '#000', 1));
+        }
+        //处理null-text
+        if (this.element.isDecorate && this.element.disableClick && !this.element.parent) {
+            t.data.attrs['opacity'] = '0.58';
         }
         return t;
     }
@@ -5091,10 +5073,7 @@ class SelectionRange {
     }
     setInfo(control, offset) {
         if (control instanceof LeafElement) {
-            if (control instanceof TextGroupElement) {
-                offset = offset === -1 ? control.text.length : offset;
-            }
-            offset = offset === -1 ? 1 : offset;
+            offset = ElementUtil.fixedOffset(control, offset);
             return { control, offset };
         }
         else if (control instanceof BranchElement) {
@@ -6293,6 +6272,40 @@ class TableUtil {
             });
         }
     }
+    static getTableData(tb) {
+        //根据实际要提取的行索引进行调整
+        const rowData = [];
+        for (let i = 0; i < tb.length; i++) {
+            const row = tb.getChild(i);
+            const cellData = [];
+            for (let j = 0; j < row.length; j++) {
+                const cell = row.getChild(j);
+                cellData.push(this.getCellData(cell));
+            }
+            rowData.push(cellData);
+        }
+        return rowData;
+    }
+    /**
+     * 获取单元格内的数据元的值
+     * @param target
+     */
+    static getCellData(target) {
+        if (validateDataEle(target)) {
+            const dataEle = target;
+            return { id: dataEle.props.id, value: dataEle.getValue() };
+        }
+        if (target instanceof BranchElement) {
+            for (let i = 0; i < target.length; i++) {
+                const child = target.getChild(i);
+                const val = this.getCellData(child);
+                if (val !== null) {
+                    return val;
+                }
+            }
+        }
+        return null;
+    }
 }
 
 class TableElement extends BlockContainerElement {
@@ -8673,6 +8686,46 @@ class ElementUtil {
             ]
         };
     }
+    /**
+     * 判断是否光标可以设置接受编辑
+     * @returns
+     */
+    static canSetCursor(startControl, startOffset, editable, viewOptions) {
+        if (!startControl || !editable) {
+            return false;
+        }
+        if (viewOptions.docMode === DocMode.Design) {
+            return true;
+        }
+        //浏览模式
+        if (viewOptions.docMode === DocMode.View) {
+            return false;
+        }
+        //表单模式下，如果不在数据元素中，则不显示光标
+        if (viewOptions.docMode === DocMode.FormEdit) {
+            if (!IsInSideDataElement(startControl, startOffset)) {
+                return false;
+            }
+        }
+        if (!ElementUtil.verifyHitable(startControl)) {
+            return false;
+        }
+        //表单模式下，数据元不可编辑
+        if (viewOptions.docMode === DocMode.FormEdit && IsInSideDataElement(startControl, startOffset)) {
+            const dataEle = ElementUtil.getDataElement(startControl);
+            if (dataEle && !dataEle.props.editable) {
+                return false;
+            }
+        }
+        return true;
+    }
+    static fixedOffset(control, offset) {
+        if (control instanceof TextGroupElement) {
+            offset = offset === -1 ? control.text.length : offset;
+        }
+        offset = offset === -1 ? 1 : offset;
+        return offset;
+    }
 }
 
 class RenderContext {
@@ -10846,7 +10899,7 @@ class DataElementCheckRenderObject extends LeafRenderObject {
                     data: {
                         ns: "http://www.w3.org/2000/svg",
                         attrs: {
-                            cx: width / 2,
+                            cx: 2 + width / 2,
                             cy: height / 2,
                             r: width / 3,
                             stroke: 'black',
@@ -10861,7 +10914,7 @@ class DataElementCheckRenderObject extends LeafRenderObject {
                         data: {
                             ns: "http://www.w3.org/2000/svg",
                             attrs: {
-                                cx: width / 2,
+                                cx: 2 + width / 2,
                                 cy: height / 2,
                                 r: width / 5,
                                 stroke: 'black',
@@ -17558,7 +17611,6 @@ class DocumentEvent {
             if (resizeColWidth < minColWidth || cellWidth < minColWidth) {
                 return;
             }
-            console.log(resizeColWidth, cellWidth);
             table.setCellWidth(resizeColIndex, resizeColWidth);
             table.setCellWidth(cellIndex, cellWidth);
             this.edgeRenderInfo.mousedownPos = this.currentPos;
@@ -17732,6 +17784,15 @@ class DocumentEvent {
      */
     moveCursorToLeft() {
         const { startControl, startOffset } = this.selectionState;
+        this.moveCursorToLeftHandle(startControl, startOffset);
+    }
+    /**
+     * 向左移动光标处理函数
+     * @param startControl
+     * @param startOffset
+     * @private
+     */
+    moveCursorToLeftHandle(startControl, startOffset) {
         if (startOffset === 0) {
             const oldRegion = ElementUtil.getElementRegion(startControl);
             const prevEle = ElementUtil.getRecursionPrevSiblingElement(startControl, false, true, this.viewOptions);
@@ -17740,6 +17801,10 @@ class DocumentEvent {
                 if (newRegion !== oldRegion) {
                     return;
                 }
+                if (this.viewOptions.docMode === DocMode.FormEdit && !ElementUtil.canSetCursor(prevEle, ElementUtil.fixedOffset(prevEle, -1), true, this.viewOptions)) {
+                    this.moveCursorToLeftHandle(prevEle, 0);
+                    return;
+                }
                 this.selectionState.resetRange(prevEle, -1);
                 return;
             }
@@ -17749,6 +17814,10 @@ class DocumentEvent {
                 this.selectionState.resetRange(startControl, startOffset - 1);
             }
             else {
+                if (this.viewOptions.docMode === DocMode.FormEdit && !ElementUtil.canSetCursor(startControl, ElementUtil.fixedOffset(startControl, 0), true, this.viewOptions)) {
+                    this.moveCursorToLeftHandle(startControl, 0);
+                    return;
+                }
                 this.selectionState.resetRange(startControl, 0);
             }
         }
@@ -17758,6 +17827,9 @@ class DocumentEvent {
      */
     moveCursorToRight() {
         const { startControl, startOffset } = this.selectionState;
+        this.moveCursorToRightHandle(startControl, startOffset);
+    }
+    moveCursorToRightHandle(startControl, startOffset) {
         if (this.isLeafEleEndOffset(startControl, startOffset)) {
             const oldRegion = ElementUtil.getElementRegion(startControl);
             const nextEle = ElementUtil.getRecursionNextSiblingElement(startControl, false, true, this.viewOptions);
@@ -17766,7 +17838,11 @@ class DocumentEvent {
                 if (oldRegion !== newRegion) {
                     return;
                 }
-                this.selectionState.resetRange(nextEle, 0);
+                if (this.viewOptions.docMode === DocMode.FormEdit && !ElementUtil.canSetCursor(nextEle, ElementUtil.fixedOffset(nextEle, -1), true, this.viewOptions)) {
+                    this.moveCursorToRightHandle(nextEle, ElementUtil.fixedOffset(nextEle, -1));
+                    return;
+                }
+                this.selectionState.resetRange(nextEle, 1);
                 return;
             }
         }
@@ -17775,6 +17851,10 @@ class DocumentEvent {
                 this.selectionState.resetRange(startControl, startOffset + 1);
             }
             else {
+                if (this.viewOptions.docMode === DocMode.FormEdit && !ElementUtil.canSetCursor(startControl, 0, true, this.viewOptions)) {
+                    this.moveCursorToRightHandle(startControl, ElementUtil.fixedOffset(startControl, -1));
+                    return;
+                }
                 this.selectionState.resetRange(startControl, 1);
             }
         }
@@ -19799,17 +19879,81 @@ function printNodes(printNodes, options, printEvent = null) {
 
 class DocumentTemplate {
     static createA4Doc() {
+        return DocumentTemplate.createDoc('A4');
+    }
+    static createDoc(name = 'A4') {
         const doc = new DocumentElement();
         doc.props = new DocumentProps();
-        doc.props.width = 210;
-        doc.props.height = 297;
-        doc.props.padding = new PaddingProps(25.4, 25.4, 19.1, 19.1);
+        const paper = DocumentTemplate.getPaper(name);
+        doc.props.width = paper.width;
+        doc.props.height = paper.height;
+        doc.props.padding = new PaddingProps(paper.top, paper.bottom, paper.left, paper.right);
         doc.addChild(new DocumentHeaderElement());
         doc.addChild(new DocumentBodyElement());
         doc.addChild(new DocumentFooterElement());
         return doc;
     }
-}
+    static getPaper(name) {
+        let top = 25.4, bottom = 25.4, left = 19.1, right = 19.1;
+        const paper = PageSize.find(item => item.name.toUpperCase() === name.toUpperCase());
+        if (paper) {
+            if (top + bottom + 30 > paper.height) {
+                top = bottom = 0;
+            }
+            if (left + right + 30 > paper.width) {
+                left = right = 0;
+            }
+            return {
+                width: paper.width,
+                height: paper.height,
+                top, left, right, bottom
+            };
+        }
+        return { width: PageSize[0].width, height: PageSize[0].height, top, left, right, bottom };
+    }
+}
+const PageSize = [
+    { name: 'A4', width: 210, height: 297 },
+    { name: 'A5', width: 148, height: 210 },
+    { name: 'A6', width: 105, height: 148 },
+    { name: 'B5', width: 176, height: 250 },
+    { name: 'B6', width: 125, height: 176 },
+    { name: 'Letter', width: 216, height: 279 },
+    { name: 'Legal', width: 216, height: 356 },
+    { name: 'Executive', width: 184, height: 267 },
+    { name: 'Folio', width: 210, height: 330 },
+    { name: 'Quarto', width: 215, height: 275 },
+    { name: '10x15cm', width: 100, height: 150 },
+    { name: '13x18cm', width: 130, height: 180 },
+    { name: '15x20cm', width: 150, height: 200 },
+    { name: '20x25cm', width: 200, height: 250 },
+    { name: '20x30cm', width: 200, height: 300 },
+    { name: '25x35cm', width: 250, height: 350 },
+    { name: '30x40cm', width: 300, height: 400 },
+    { name: 'A0', width: 841, height: 1189 },
+    { name: 'A1', width: 594, height: 841 },
+    { name: 'A2', width: 420, height: 594 },
+    { name: 'A3', width: 297, height: 420 },
+    { name: 'A7', width: 74, height: 105 },
+    { name: 'A8', width: 52, height: 74 },
+    { name: 'A9', width: 37, height: 52 },
+    { name: 'A10', width: 26, height: 37 },
+    { name: 'B0', width: 1000, height: 1414 },
+    { name: 'B1', width: 707, height: 1000 },
+    { name: 'B2', width: 500, height: 707 },
+    { name: 'B3', width: 353, height: 500 },
+    { name: 'B4', width: 250, height: 353 },
+    { name: 'B7', width: 88, height: 125 },
+    { name: 'B8', width: 62, height: 88 },
+    { name: 'B9', width: 44, height: 62 },
+    { name: 'B10', width: 31, height: 44 },
+    { name: 'C5E', width: 163, height: 229 },
+    { name: 'Comm10E', width: 105, height: 241 },
+    { name: 'DLE', width: 110, height: 220 },
+    { name: 'Folio', width: 210, height: 330 },
+    { name: 'Ledger', width: 432, height: 279 },
+    { name: 'Tabloid', width: 279, height: 432 }
+];
 
 /**
  * 处理文档批注
@@ -26896,33 +27040,7 @@ class DocEditor {
      */
     canSetCursor() {
         const { startControl, startOffset, editable } = this.selectionState;
-        if (!startControl || !editable) {
-            return false;
-        }
-        if (this.viewOptions.docMode === DocMode.Design) {
-            return true;
-        }
-        //浏览模式
-        if (this.viewOptions.docMode === DocMode.View) {
-            return false;
-        }
-        //表单模式下，如果不在数据元素中，则不显示光标
-        if (this.viewOptions.docMode === DocMode.FormEdit) {
-            if (!IsInSideDataElement(startControl, startOffset)) {
-                return false;
-            }
-        }
-        if (!ElementUtil.verifyHitable(startControl)) {
-            return false;
-        }
-        //表单模式下，数据元不可编辑
-        if (this.viewOptions.docMode === DocMode.FormEdit && IsInSideDataElement(startControl, startOffset)) {
-            const dataEle = ElementUtil.getDataElement(startControl);
-            if (dataEle && !dataEle.props.editable) {
-                return false;
-            }
-        }
-        return true;
+        return ElementUtil.canSetCursor(startControl, startOffset, editable, this.viewOptions);
     }
     /**
      * 修改光标
@@ -27122,10 +27240,11 @@ class DocEditor {
     /**
      * 新建文档
      * @param doc
+     * @param name
      */
-    createNewDoc(doc = null) {
+    createNewDoc(doc = null, name = 'A4') {
         //this.docCtx.clear();
-        const newDoc = doc ?? DocumentTemplate.createA4Doc();
+        const newDoc = doc ?? DocumentTemplate.createDoc(name);
         // this.elementReader.setDocument(newDoc);
         // this.refreshDocument('content');
         this.loadDoc(ElementSerialize.serialize(newDoc, this.viewOptions));
@@ -27349,12 +27468,13 @@ class DocEditor {
         this.resetViewer('force');
         this.selectionState.clear();
     }
-    /**
-     * 设置纸张大小,单位为毫米(mm)
-     * @param width
-     * @param height
-     */
     setPaperSize(width, height) {
+        if (typeof width === 'string') {
+            const paperSize = DocumentTemplate.getPaper(width);
+            width = paperSize.width;
+            height = paperSize.height;
+        }
+        height = height;
         const docProps = this.docCtx.document.props;
         docProps.width = width;
         docProps.height = height;
@@ -27564,7 +27684,7 @@ class DocEditor {
         const vNodeFunc = this.renderRoot();
         setActiveEditorContext(null);
         const render = () => {
-            //console.time('patch');
+            console.time('patch');
             setActiveEditorContext(this);
             const vNode = vNodeFunc.render();
             setActiveEditorContext(null);
@@ -27576,7 +27696,7 @@ class DocEditor {
                 this.vNodeDocContent = this.nodePatch(this.svgContainer, vNode);
             }
             this.afterNodePatch.next();
-            //console.timeEnd('patch');
+            console.timeEnd('patch');
         };
         render();
         this.onShouldRender.subscribe(() => {