@hailin-zheng/editor-core 1.1.2 → 1.1.3

package/controls/ScrollView.d.ts

@@ -18,6 +18,7 @@ export declare class ScrollView extends NodeItems {
     get scrollY(): number;
     set scrollY(value: number);
     constructor();
+    scrollTo(x: number, y: number): void;
     measureOverride(e: IMeasureEvent, availableSize: Size): Size;
     getRenderItems(): Array<NodeCore>;
     protected arrangeOverride(e: IArrangeEvent, finalSize: Size): Size;

package/controls/ViewPaint.d.ts

@@ -1,10 +1,10 @@
 import { TextProps } from "../med_editor/framework/element-props";
 import { Position, Rect } from "../med_editor/framework/element-define";
 import { ISetCanvasPageProps, TextUnits } from "../med_editor/framework/render-context";
-import { Subject } from "../med_editor/framework/event-subject";
+import { OnceSubject } from "../med_editor/framework/event-subject";
 export declare class ViewPaint {
     ctx: CanvasRenderingContext2D;
-    onRenderCompleted: Subject<ViewPaint>;
+    onRenderCompleted: OnceSubject<ViewPaint>;
     pageSetting: ISetCanvasPageProps;
     pageRect: Rect;
     constructor(ctx: CanvasRenderingContext2D);

package/index-cjs.js

@@ -394,6 +394,7 @@ class BlockContentRenderObject extends BranchRenderObject {
     }
 }
 class InlineGroupRenderObject extends BranchRenderObject {
+    paintPos;
 }
 /**
  * 包含块级渲染元素的容器元素,例如body、table-cell等
@@ -935,8 +936,10 @@ class Subject$1 extends EventSourceCore$1 {
         this.addSub(sub);
         return sub;
     }
-    onceSubscribe(listener) {
-        const sub = this.subscribe(listener);
+}
+class OnceSubject extends Subject$1 {
+    subscribe(listener) {
+        const sub = super.subscribe(listener);
         sub.once = true;
         return sub;
     }
@@ -1323,13 +1326,23 @@ class BranchElement extends Element {
         }
         else {
             this.modifyFlag = exports.ModifyFlag.Modify;
-            for (let i = 0; i < this.length; i++) {
-                this.getChild(i).pubOnChange('to-child');
-            }
+            clearChildrenRenderCache(this);
+            // for (let i = 0; i < this.length; i++) {
+            //     this.getChild(i).pubOnChange('to-child')
+            // }
         }
         this._onChangeEvent.next();
     }
 }
+function clearChildrenRenderCache(ele) {
+    for (let i = 0; i < ele.length; i++) {
+        const curr = ele.getChild(i);
+        curr.cacheRender = null;
+        if (curr instanceof BranchElement) {
+            clearChildrenRenderCache(curr);
+        }
+    }
+}
 /**
  * 行内编组元素
  */
@@ -1443,6 +1456,8 @@ class ViewOptions {
     defaultColor = "rgb(0,0,0)";
     selectionOverlaysColor = 'rgb(131,175,155,0.5)';
     dataEleOverlaysColor = 'rgb(131,175,155,0.5)';
+    dataEleFocusedBgColor = 'rgb(131,175,155,0.8)';
+    dataEleErrorBgColor = '#ff4d4f';
     dataEleReadOnlyOverlayColor = '#d9d9d9';
     dataEleOutlineColor = 'rgb(131,175,155,0.7)';
     viewBackcolor = 'rgb(230,230,230)';
@@ -1474,6 +1489,8 @@ class ViewOptions {
     enableDyExpression = false;
     //是否显示标尺
     showRule = true;
+    //是否开启数据元输入验证功能
+    enableDataEleInputValidate = false;
     //整页模式，不分页
     _fullPageView = false;
     get fullPageView() {
@@ -3678,8 +3695,12 @@ class InlineGroupInputElement extends InlineGroupElement {
     }
 }
 class DataElementInlineGroup extends InlineGroupInputElement {
+    errorTip;
     constructor(type) {
         super(type);
+        this.onChangeSubject.subscribe(() => {
+            this.onChangedValidate();
+        });
         this.addEvent('ElementMousemove', (evt) => {
             this.isMouseenter = true;
             this.refreshView();
@@ -3743,6 +3764,21 @@ class DataElementInlineGroup extends InlineGroupInputElement {
             this.expressFn = new Function();
         }
     }
+    /**
+     * 数据元发生更改后，进行数据验证
+     */
+    onChangedValidate() {
+        this.errorTip = '';
+        const options = getCurrOptions(this);
+        if (!options || !options.enableDataEleInputValidate) {
+            return;
+        }
+        this.errorTip = this.validate();
+    }
+}
+function getCurrOptions(ele) {
+    const doc = ElementUtil.getParent(ele, item => item.type === 'doc');
+    return doc?.viewOptions;
 }
 class DataElementRenderObject extends InlineGroupRenderObject {
     render(e) {
@@ -3753,9 +3789,18 @@ class DataElementRenderObject extends InlineGroupRenderObject {
         }
         render.contentContext.tran(() => {
             //绘制数据元区域底色
+            let bgColor = '';
             if (this.element.isMouseenter) {
-                const overlayColor = this.element.props.editable ? viewOptions.dataEleOverlaysColor : viewOptions.dataEleReadOnlyOverlayColor;
-                render.overlaysContext.fillRect(position.x, position.y - 2, this.rect.width, this.rect.height + 4, overlayColor);
+                bgColor = this.element.props.editable ? viewOptions.dataEleOverlaysColor : viewOptions.dataEleReadOnlyOverlayColor;
+            }
+            if (this.element.isFocused) {
+                bgColor = e.docCtx.viewOptions.dataEleFocusedBgColor;
+            }
+            if (this.element.errorTip) {
+                bgColor = viewOptions.dataEleErrorBgColor;
+            }
+            if (bgColor) {
+                render.overlaysContext.fillRect(position.x, position.y - 2, this.rect.width, this.rect.height + 4, bgColor);
             }
             if (this.element.props.secretBrowse && viewOptions.secretBrowse) {
                 render.contentContext.ctx.filter = "blur(10px)";
@@ -3777,23 +3822,25 @@ class DataElementRenderObject extends InlineGroupRenderObject {
      * @private
      */
     drawCaption(e) {
-        const { render, position, docCtx: { viewOptions } } = e;
-        //获取到焦点时，绘制数据元标题
-        if (render.drawMode === 'view' && this.element.isFocused && this.element.paintRenders.indexOf(this) === 0) {
-            const { caption } = this.element.props;
-            if (!caption) {
-                return;
+        e.render.onRenderCompleted.subscribe(() => {
+            const { render, position, docCtx: { viewOptions } } = e;
+            //获取到焦点时，绘制数据元标题
+            if (render.drawMode === 'view' && this.element.isFocused && this.element.paintRenders.indexOf(this) === 0) {
+                const { caption } = this.element.props;
+                if (!caption) {
+                    return;
+                }
+                const textProps = new TextProps();
+                textProps.fontSize = 16;
+                textProps.fontName = viewOptions.defaultFontName;
+                textProps.color = '#fff';
+                const titleWidth = render.contentContext.measureText(caption, textProps).width;
+                const x = position.x;
+                const y = position.y - 20;
+                render.contentContext.fillRect(x, y, titleWidth + 10, 20, 'blue');
+                render.contentContext.drawText(caption, textProps, x + 5, y, titleWidth, 20);
             }
-            const textProps = new TextProps();
-            textProps.fontSize = 16;
-            textProps.fontName = viewOptions.defaultFontName;
-            textProps.color = '#fff';
-            const titleWidth = render.contentContext.measureText(caption, textProps).width;
-            const x = position.x;
-            const y = position.y - 20;
-            render.contentContext.fillRect(x, y, titleWidth + 10, 20, 'blue');
-            render.contentContext.drawText(caption, textProps, x + 5, y, titleWidth, 20);
-        }
+        });
     }
 }
 const validateDataEle = (ele) => {
@@ -4578,6 +4625,9 @@ class TableCellElement extends BlockContainerElement {
             throw new Error('row is null');
         }
         const table = row.parent;
+        if (!table) {
+            debugger;
+        }
         const cellIndex = row.getChildIndex(this);
         let cellWidth = table.getCellWidth(cellIndex);
         const cellOffset = table.getCellOffsetX(cellIndex);
@@ -7623,8 +7673,7 @@ class RenderContext {
     drawMode = 'view';
     contentOffCanvas;
     overlayOffCanvas;
-    //pageRect!: Omit<Rect, any>;
-    onRenderCompleted = new Subject$1();
+    onRenderCompleted = new OnceSubject();
     constructor(mainContext) {
         this.mainContext = mainContext;
     }
@@ -7646,7 +7695,6 @@ class RenderContext {
         this.pageRect = { x: 0, y: 0, width: pageSetting.width, height: pageSetting.height };
         ElementUtil.setCanvasProps(this.contentOffCanvas, this.contentContext.ctx, pageSetting);
         ElementUtil.setCanvasProps(this.overlayOffCanvas, this.overlaysContext.ctx, pageSetting);
-        //ElementUtil.setCanvasProps(this.mainContext.ctx.canvas, this.mainContext.ctx, pageSetting)
     }
     clear() {
         this.contentContext.clear();
@@ -8685,7 +8733,7 @@ class DataElementDate extends DataElementInlineGroup {
         this.props.valueTextProps.clone(valueText.props);
         valueText.text = formatStr;
         this.addChild(valueText, this.length - 1);
-        //this.beginMeasure();
+        this.onChangedValidate();
     }
     getValue() {
         return ElementSerialize.serializeString(this);
@@ -8775,9 +8823,9 @@ class DataElementGroupElement extends InlineGroupInputElement {
     }
 }
 class DataElementGroupRenderObject extends InlineGroupRenderObject {
-    paintPos;
     render(e) {
         this.paintPos = e.position;
+        e.render.onRenderCompleted.subscribe(() => { this.paintDecorate(e); });
     }
     getCurrentParaGroupRenders() {
         const renders = [];
@@ -8790,7 +8838,7 @@ class DataElementGroupRenderObject extends InlineGroupRenderObject {
         }
         return renders;
     }
-    pagePaintCompleted(e) {
+    paintDecorate(e) {
         const { render, docCtx: { viewOptions } } = e;
         const canPaint = this.element.isMouseenter || this.element.isFocused;
         if (canPaint && this.element.paintRenders.indexOf(this) === 0) {
@@ -9051,6 +9099,7 @@ class DataElementList extends DataElementInlineGroup {
                 this.addChild(valueText, this.length - 1);
             }
         }
+        this.onChangedValidate();
     }
     getValue() {
         const values = ElementSerialize.serializeString(this);
@@ -9144,6 +9193,7 @@ class DataElementText extends DataElementInlineGroup {
             valueText.text = val + '';
             this.addChild(valueText, this.length - 1);
         }
+        this.onChangedValidate();
     }
     getValue() {
         return ElementSerialize.serializeString(this, { all: false });
@@ -10980,8 +11030,6 @@ class ElementPaint {
     }
     paintPagePos;
     drawPages(docContainer, selectedSets) {
-        // this.rePaint = rePaint;
-        //this.measureCommContainer = measureCommContainer;
         this.selectedSets = selectedSets;
         const pageCount = docContainer.length;
         const containerPos = { x: docContainer.rect.x - this.viewOptions.pageOffset.x, y: docContainer.rect.y - this.viewOptions.pageOffset.y };
@@ -11007,13 +11055,13 @@ class ElementPaint {
         });
         nextRenderFn();
         const { scale, viewSettings: { width, height } } = this.viewOptions;
+        while (this.renderCtx.onRenderCompleted.subs.length > 0) {
+            this.renderCtx.onRenderCompleted.next();
+        }
         this.renderCtx.commit({ width, height, scale }, this.viewOptions.pageOffset);
     }
     drawRenderObject(renderObject, parent, parentInViewPort = false) {
         const element = renderObject.element;
-        // if (this.rePaint && element) {
-        //     //element.paintRenders.push(renderObject);
-        // }
         const { x: rx, y: ry, width: rw, height: rh } = renderObject.rect;
         const currPosition = { x: rx + parent.x, y: ry + parent.y };
         //判断当前绘制元素是否在视窗内
@@ -11053,18 +11101,6 @@ class ElementPaint {
                 };
                 renderObject.render(renderData);
             }
-            // //审阅信息
-            // if (this.viewOptions.showReviewWindow && element && element.type === 'comm') {
-            //     const commElement = element as CommentElement;
-            //     if (commElement.props.markType === 'start') {
-            //         //获取当前绘制元素相对于当前页的坐标
-            //         this.paintCommMap.push({
-            //             ele: commElement,
-            //             render: renderObject,
-            //             pos: { x: currPosition.x - this.paintPagePos.x, y: currPosition.y - this.paintPagePos.y }
-            //         });
-            //     }
-            // }
         }
         //处理选中拖蓝
         if (inViewPort && this.selectedSets.has(element)) {
@@ -11500,6 +11536,7 @@ class EditorContext {
         this.clearPrevDocCb?.();
         //this.ele_types_handlers.length = 0;
         this.imageLoader.clear();
+        this._document = null;
     }
     /**
      * 切换行打印模式
@@ -11879,6 +11916,8 @@ class DynamicContextParser {
     TableData(tableId, startRow, startCol, endRow, endCol) {
         const tb = this.doc.treeFind(item => item instanceof TableElement && item.props.id === tableId);
         const res = [];
+        startRow = startRow < 0 ? tb.length + startRow : startRow;
+        startCol = startCol < 0 ? tb.length + startCol : startCol;
         endRow = endRow < 0 ? tb.length + endRow : endRow;
         endCol = endCol < 0 ? tb.length + endCol : endCol;
         for (let i = startRow; i <= endRow; i++) {
@@ -12256,8 +12295,15 @@ class ParagraphMeasure {
                     }
                 }
             }
-            if (ele.length > 2) ;
-            this.arrange(data, ele.getChild(i));
+            this.arrangeInlineItems(data, ele.getChild(i));
+        }
+    }
+    arrangeInlineItems(parentLine, ele) {
+        if (ele instanceof InlineGroupElement) {
+            this.arrangeInlineGroupElement(parentLine, ele);
+        }
+        else {
+            this.arrange(parentLine, ele);
         }
     }
     arrangeLeafElement(parentLine, ele) {
@@ -12634,7 +12680,9 @@ class DocumentArrange {
                     continue;
                 }
                 if (Array.isArray(childRender)) {
-                    element.cacheRender = null;
+                    if (childRender.length > 1) {
+                        element.cacheRender = null;
+                    }
                     for (let j = 0; j < childRender.length; j++) {
                         if (j > 0) {
                             render = this.createRenderObject(element);
@@ -18306,7 +18354,6 @@ function getCurrentActiveAppContext() {
 function setCurrentActiveAppContext(ctx) {
     currentActiveAppContext = ctx;
 }
-let taskId;
 function renderApp(root, renderCtx, nodeEvent) {
     window['root'] = root;
     // const nodeEvent = new NodeEvent(root, renderCtx.mainContext.ctx.canvas);
@@ -18316,15 +18363,13 @@ function renderApp(root, renderCtx, nodeEvent) {
             return;
         }
         delayTask = true;
-        taskId = setTimeout(() => {
-            console.log(taskId + "正在运行中");
+        setTimeout(() => {
             currentActiveAppContext = { root, render: flushTask };
             delayTask = false;
             root.clearPopNodes();
             prepareRender(root, renderCtx, nodeEvent.appState);
             updateCursor(nodeEvent, renderCtx);
             currentActiveAppContext = null;
-            console.log(taskId + "运行完成");
         }, 16);
     };
     flushTask();
@@ -19265,7 +19310,7 @@ function invokeNodeEvent(node, event, name, useCapture) {
 
 class ViewPaint {
     ctx;
-    onRenderCompleted = new Subject$1();
+    onRenderCompleted = new OnceSubject();
     pageSetting;
     pageRect;
     constructor(ctx) {
@@ -20028,7 +20073,7 @@ class MenuContainer extends NodeItems {
     }
     preRender(e) {
         const { render, renderPos, next } = e;
-        e.render.onRenderCompleted.onceSubscribe((render) => {
+        e.render.onRenderCompleted.subscribe((render) => {
             e.appState.surface.registerPopNode(this);
             const parentPos = { x: renderPos.x - this.finalRect.x, y: renderPos.y - this.finalRect.y };
             render.tran(() => {
@@ -20102,11 +20147,31 @@ class ScrollView extends NodeItems {
         });
         this.addEventListener('wheel', evt => {
             const { deltaY, deltaX } = evt;
-            console.log(`deltaX:${deltaX},deltaY:${deltaY}`);
             this.horBar.updateScrollByCurrent(deltaX / 10, deltaY / 10);
             this.verBar.updateScrollByCurrent(deltaX / 10, deltaY / 10);
         });
     }
+    scrollTo(x, y) {
+        if (!this.content.finalRect || !this.finalRect) {
+            return;
+        }
+        if (y > this.content.finalRect.height) {
+            y = this.content.finalRect.height;
+        }
+        if (x > this.content.finalRect.width) {
+            x = this.content.finalRect.width;
+        }
+        let scrollX = x - this.finalRect.width;
+        let scrollY = y - this.finalRect.height;
+        scrollX = scrollX < 0 ? 0 : scrollX;
+        scrollY = scrollY < 0 ? 0 : scrollY;
+        this.scrollX = scrollX;
+        this.scrollY = scrollY;
+        this.onScrollEvent.next({
+            x: this.scrollX,
+            y: this.scrollY
+        });
+    }
     measureOverride(e, availableSize) {
         const measureSize = availableSize;
         this.content.measure(e, measureSize);
@@ -20329,10 +20394,6 @@ class ScrollBar extends NodeItems {
         const x = this.orientation === 'horizontal' ? (scrollView.scrollX / scrollView.content.finalRect.width) * finalSize.width : (ScrollBarSize - this.thumbSize) / 2;
         const y = this.orientation === 'horizontal' ? (ScrollBarSize - this.thumbSize) / 2 : (scrollView.scrollY / scrollView.content.finalRect.height) * finalSize.height;
         this.thumb.arrange(e, { x, y, width, height });
-        if (this.orientation === 'vertical') {
-            console.log(y, height, finalSize.width, finalSize.height, scrollView.scrollY);
-            if (scrollView.scrollY === 4.723577235772358) ;
-        }
         return super.arrangeOverride(e, finalSize);
     }
     render(e) {
@@ -20436,6 +20497,9 @@ class RuleControl extends NodeItems {
         super();
         this.docCtx = docCtx;
         this.ss = docCtx.selectionState;
+        this.bgColor = '#fff';
+        this.shadowBlur = 5;
+        this.shadowColor = '#000';
         this.options = {
             width: 0,
             pagePL: 0,
@@ -21135,7 +21199,7 @@ class CanvasTextEditor extends NodeItems {
      */
     docClickHandle(evt) {
         this.setCursor();
-        this.selectionOverlays.getSelectionTreeData();
+        this.updateSelection();
         this.onClickEvent.next(evt);
     }
     /**
@@ -21147,6 +21211,7 @@ class CanvasTextEditor extends NodeItems {
         if (res) {
             this.flushToSchedule();
         }
+        this.updateSelection();
         this.onDblClickEvent.next(evt);
     }
     /**
@@ -21553,6 +21618,7 @@ class CanvasTextEditor extends NodeItems {
                 return;
             }
             //this.docScroll.scrollTo(cursorPos.rect.x, cursorPos.rect.y - this.viewOptions.translateY);
+            this.scrollView.scrollTo(cursorPos.rect.x, cursorPos.rect.y + 100);
         }
     }
     /**
@@ -21709,6 +21775,13 @@ class CanvasTextEditor extends NodeItems {
         scrollView.y = 30;
         this.scrollView = scrollView;
         scrollView.content.addChild(this);
+        const label = new LabelNode();
+        label.text = '请注意了';
+        label.bgColor = '#fff';
+        label.padding = 2;
+        label.x = 100;
+        label.y = 100;
+        //this.addChild(label);
         scrollView.onScrollEvent.subscribe(data => {
             //console.log(data);
             this.viewOptions.pageOffset.x = data.x;
@@ -21812,6 +21885,24 @@ class CanvasTextEditor extends NodeItems {
             appCtx.root.setInputPosition(caretPos);
         }
     }
+    measureOverride(e, availableSize) {
+        this.controls.forEach(item => {
+            item.measure(e, availableSize);
+        });
+        return super.measureOverride(e, availableSize);
+    }
+    arrangeOverride(e, finalSize) {
+        this.controls.forEach(item => {
+            const itemRect = {
+                x: item.x,
+                y: item.y,
+                width: item.desiredSize.width,
+                height: item.desiredSize.height
+            };
+            item.arrange(e, itemRect);
+        });
+        return super.arrangeOverride(e, finalSize);
+    }
 }
 
 /**
@@ -22240,6 +22331,7 @@ exports.MarginProps = MarginProps;
 exports.MouseElementEvent = MouseElementEvent;
 exports.MousedownElementEvent = MousedownElementEvent;
 exports.MuiltBlockLineRenderObject = MuiltBlockLineRenderObject;
+exports.OnceSubject = OnceSubject;
 exports.PSymbolElement = PSymbolElement;
 exports.PSymbolRenderObject = PSymbolRenderObject;
 exports.PaddingProps = PaddingProps;