@hailin-zheng/editor-core 2.0.15 → 2.0.17

package/index.js

@@ -2243,12 +2243,14 @@ class DataEleListProps extends DataEleBaseTextProps {
      * 是否允许多选
      */
     multiSelect;
+    displayField = 'value';
     clone(dest) {
         const clone = dest ?? new DataEleListProps();
         super.clone(clone);
         clone.options = [...this.options];
         clone.dropDownStyle = this.dropDownStyle;
         clone.multiSelect = this.multiSelect;
+        clone.displayField = this.displayField;
         return clone;
     }
     getSerializeProps(options) {
@@ -2257,6 +2259,9 @@ class DataEleListProps extends DataEleBaseTextProps {
             multiSelect: this.multiSelect,
             dropDownStyle: this.dropDownStyle,
         };
+        if (this.displayField && this.displayField !== 'value') {
+            props['displayField'] = this.displayField;
+        }
         super.getBaseProps(props, options);
         return props;
     }
@@ -2265,6 +2270,7 @@ class DataEleListProps extends DataEleBaseTextProps {
         this.options = props.options;
         this.multiSelect = props.multiSelect;
         this.dropDownStyle = props.dropDownStyle;
+        this.displayField = props.displayField;
     }
 }
 class CommContentProps extends INotifyPropertyChanged {
@@ -2318,6 +2324,7 @@ class DataEleCheckProps extends DataEleBaseProps {
     falseChar = falseChar;
     trueStateColor = '#f00000';
     falseStateColor = '#000000';
+    style = 'CheckBox';
     clone(dest) {
         const clone = dest ?? new DataEleCheckProps();
         super.cloneBaseProps(clone);
@@ -2332,6 +2339,7 @@ class DataEleCheckProps extends DataEleBaseProps {
         clone.border = this.border;
         clone.trueStateColor = this.trueStateColor;
         clone.falseStateColor = this.falseStateColor;
+        clone.style = this.style;
         return clone;
     }
     getSerializeProps(options) {
@@ -2360,6 +2368,9 @@ class DataEleCheckProps extends DataEleBaseProps {
         if (this.falseStateColor !== '#000000') {
             props.falseStateColor = this.falseStateColor;
         }
+        if (this.style !== 'CheckBox') {
+            props.style = this.style;
+        }
         this.getBaseProps(props, options);
         return props;
     }
@@ -2376,6 +2387,7 @@ class DataEleCheckProps extends DataEleBaseProps {
         this.trueStateColor = props.trueStateColor;
         this.falseStateColor = props.falseStateColor;
         this.border = props.border;
+        this.style = props.style;
     }
 }
 class DataEleImageProps extends DataEleBaseProps {
@@ -2741,6 +2753,7 @@ class DataDecorateElement extends LeafElement {
                 }
             }
         });
+        this.disableClick = !isPrefix;
         this.isDecorate = true;
     }
     createRenderObject() {
@@ -3358,7 +3371,6 @@ class DocumentRenderObject extends BlockContainerRenderObject {
                     'font-family': '仿宋',
                     'font-size': '14',
                     "fill": this.element.props.color,
-                    'font-style': 'italic',
                     x: 0,
                     y: 0,
                 }
@@ -4249,7 +4261,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() {
@@ -4749,7 +4761,7 @@ class TextGroupRenderObject extends LeafRenderObject {
             return curr.actualSize + prev;
         }, this.rect.x);
         const x = arr.join(' ');
-        const y = this.textMeasures.map(item => this.rect.y + vertHeight).join(' ');
+        const y = this.rect.y + vertHeight; //this.textMeasures.map(item => this.rect.y + vertHeight).join(' ');
         const text = this.textMeasures.map(item => {
             return item.char;
         }).join('');
@@ -4798,6 +4810,10 @@ class TextGroupRenderObject extends LeafRenderObject {
             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;
     }
 }
@@ -5069,10 +5085,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) {
@@ -6271,6 +6284,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 {
@@ -8651,6 +8698,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 {
@@ -10784,74 +10871,83 @@ class DataElementCheckRenderObject extends LeafRenderObject {
             });
         }
         else {
+            const style = props.style;
             if (props.multiSelect) {
-                t.children.push({
-                    sel: 'rect',
-                    data: {
-                        ns: "http://www.w3.org/2000/svg",
-                        attrs: {
-                            x: 2,
-                            y: 0,
-                            width,
-                            height,
-                            stroke: 'black',
-                            fill: 'none',
-                            'stroke-width': 1
-                        }
-                    }
-                });
-                if (props.checked) {
-                    const paths = ElementUtil.getCheckboxPath(2, 0, props.size, props.size);
-                    t.children.push({
-                        sel: 'path',
-                        data: {
-                            ns: "http://www.w3.org/2000/svg",
-                            attrs: {
-                                d: paths.map((item, index) => {
-                                    return `${index === 0 ? 'M' : 'L'}${item.x},${item.y}`;
-                                }).join(' '),
-                                stroke: 'red',
-                                fill: 'none',
-                                'stroke-width': 2
-                            }
-                        }
-                    });
-                }
+                style === 'RadioButton' ? this.drawCircleCheckbox(t, width, height, props.checked)
+                    : this.drawRectCheckbox(t, width, height, props.size, props.checked);
             }
             else {
-                t.children.push({
-                    sel: 'circle',
-                    data: {
-                        ns: "http://www.w3.org/2000/svg",
-                        attrs: {
-                            cx: width / 2,
-                            cy: height / 2,
-                            r: width / 3,
-                            stroke: 'black',
-                            fill: 'none',
-                            'stroke-width': 1
-                        }
+                style === 'CheckBox' ? this.drawRectCheckbox(t, width, height, props.size, props.checked)
+                    : this.drawCircleCheckbox(t, width, height, props.checked);
+            }
+        }
+        return t;
+    }
+    drawRectCheckbox(t, width, height, size, checked) {
+        t.children.push({
+            sel: 'rect',
+            data: {
+                ns: "http://www.w3.org/2000/svg",
+                attrs: {
+                    x: 2,
+                    y: 0,
+                    width,
+                    height,
+                    stroke: 'black',
+                    fill: 'none',
+                    'stroke-width': 1
+                }
+            }
+        });
+        if (checked) {
+            const paths = ElementUtil.getCheckboxPath(2, 0, size, size);
+            t.children.push({
+                sel: 'path',
+                data: {
+                    ns: "http://www.w3.org/2000/svg",
+                    attrs: {
+                        d: paths.map((item, index) => {
+                            return `${index === 0 ? 'M' : 'L'}${item.x},${item.y}`;
+                        }).join(' '),
+                        stroke: 'red',
+                        fill: 'none',
+                        'stroke-width': 2
                     }
-                });
-                if (props.checked) {
-                    t.children.push({
-                        sel: 'circle',
-                        data: {
-                            ns: "http://www.w3.org/2000/svg",
-                            attrs: {
-                                cx: width / 2,
-                                cy: height / 2,
-                                r: width / 5,
-                                stroke: 'black',
-                                fill: 'black',
-                                'stroke-width': 1
-                            }
-                        }
-                    });
+                }
+            });
+        }
+    }
+    drawCircleCheckbox(t, width, height, checked) {
+        t.children.push({
+            sel: 'circle',
+            data: {
+                ns: "http://www.w3.org/2000/svg",
+                attrs: {
+                    cx: 2 + width / 2,
+                    cy: height / 2,
+                    r: width / 3,
+                    stroke: 'black',
+                    fill: 'none',
+                    'stroke-width': 1
                 }
             }
+        });
+        if (checked) {
+            t.children.push({
+                sel: 'circle',
+                data: {
+                    ns: "http://www.w3.org/2000/svg",
+                    attrs: {
+                        cx: 2 + width / 2,
+                        cy: height / 2,
+                        r: width / 5,
+                        stroke: 'black',
+                        fill: 'black',
+                        'stroke-width': 1
+                    }
+                }
+            });
         }
-        return t;
     }
 }
 class DataElementCheckFactory extends ElementFactory {
@@ -10876,6 +10972,7 @@ class DataElementCheckFactory extends ElementFactory {
         dataEleProps.trueChar = props.trueChar ?? trueChar;
         dataEleProps.falseChar = props.falseChar ?? falseChar;
         dataEleProps.border = props.border ?? true;
+        dataEleProps.style = props.style ?? 'CheckBox';
         return dataEleProps;
     }
 }
@@ -11270,6 +11367,8 @@ class DataElementList extends DataElementInlineGroup {
         }
         this.pubOnChange('self');
         this.clearInnerItems();
+        let displayField = this.props.displayField;
+        displayField = displayField ? displayField : 'value';
         if (this.props.multiSelect) {
             for (let i = 0; i < vals.length; i++) {
                 const val = vals[i];
@@ -11278,12 +11377,14 @@ class DataElementList extends DataElementInlineGroup {
                     const valueText = new TextGroupElement();
                     this.props.valueTextProps.clone(valueText.props);
                     const splitSymbol = i < vals.length - 1 ? ';' : '';
-                    valueText.text = option.value + splitSymbol;
+                    valueText.text = option[displayField] + splitSymbol;
                     this.addChild(valueText, this.length - 1);
                 }
             }
         }
         else {
+            let displayField = this.props.displayField;
+            displayField = displayField ? displayField : 'value';
             if (vals.length > 1) {
                 console.warn('当前下拉框是单选模式,不能传入多个值');
             }
@@ -11292,7 +11393,7 @@ class DataElementList extends DataElementInlineGroup {
             if (option) {
                 const valueText = new TextGroupElement();
                 this.props.valueTextProps.clone(valueText.props);
-                valueText.text = option.value;
+                valueText.text = option[displayField];
                 this.addChild(valueText, this.length - 1);
             }
         }
@@ -11303,10 +11404,12 @@ class DataElementList extends DataElementInlineGroup {
         if (!values) {
             return '';
         }
+        let displayField = this.props.displayField;
+        displayField = displayField ? displayField : 'value';
         const valueItems = values.split(';');
         const valueCode = [];
         for (const valueItem of valueItems) {
-            const option = this.props.options.find(item => item.value === valueItem);
+            const option = this.props.options.find(item => item[displayField] === valueItem);
             if (option) {
                 valueCode.push(option.code);
             }
@@ -11351,6 +11454,7 @@ class DataElementListFactory extends DataElementBaseFactory {
         dataEleProps.multiSelect = props.multiSelect;
         dataEleProps.options = [...options];
         dataEleProps.dropDownStyle = props.dropDownStyle;
+        dataEleProps.displayField = props.displayField ?? 'value';
         return dataEleProps;
     }
 }
@@ -17536,7 +17640,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;
@@ -17710,6 +17813,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);
@@ -17718,6 +17830,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;
             }
@@ -17727,6 +17843,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);
             }
         }
@@ -17736,6 +17856,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);
@@ -17744,7 +17867,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;
             }
         }
@@ -17753,6 +17880,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);
             }
         }
@@ -26938,33 +27069,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);
     }
     /**
      * 修改光标
@@ -27458,6 +27563,15 @@ class DocEditor {
         const { startControl, startOffset } = this.selectionState;
         this.insertElement(startControl, startOffset, [ele]);
     }
+    test() {
+        const text = new TextGroupElement();
+        text.props.fontName = '宋体';
+        text.props.fontSize = 14;
+        text.text = '哈哈';
+        const br = new BreakElement();
+        const { startControl, startOffset } = this.selectionState;
+        this.insertElement(startControl, startOffset, [text, br]);
+    }
     switchPageLayout(mode) {
         this.viewOptions.pageLayoutMode = mode;
         this.flushToSchedule();