Browse Source

直线添加undo和redo
格式化文件

zhangyu 5 năm trước cách đây
mục cha
commit
faa09688c0
1 tập tin đã thay đổi với 106 bổ sung34 xóa
  1. 106 34
      saga-web-big/src/items/SLineItem.ts

+ 106 - 34
saga-web-big/src/items/SLineItem.ts

@@ -1,8 +1,12 @@
 import { SColor, SLine, SPainter, SPoint, SRect } from "@saga-web/draw/lib";
-import { SMouseEvent } from "@saga-web/base";
+import { SMouseEvent, SUndoStack, SMouseButton } from "@saga-web/base";
 import { SMathUtil } from "../utils/SMathUtil";
-import { SRelationState } from "..";
-import { SGraphItem } from "@saga-web/graph/lib";
+import { SItemStatus } from "..";
+import {
+    SGraphItem,
+    SGraphPointListInsert,
+    SGraphPointListUpdate
+} from "@saga-web/graph/lib";
 
 /**
  * 直线item
@@ -32,11 +36,11 @@ export class SLineItem extends SGraphItem {
     }
 
     /** 是否完成绘制  */
-    _status: SRelationState = SRelationState.Create;
-    get status(): SRelationState {
+    _status: SItemStatus = SItemStatus.Create;
+    get status(): SItemStatus {
         return this._status;
     }
-    set status(v: SRelationState) {
+    set status(v: SItemStatus) {
         this._status = v;
         this.update();
     }
@@ -80,6 +84,12 @@ export class SLineItem extends SGraphItem {
     /** 当前点索引   */
     curIndex: number = -1;
 
+    /** 当前点索引   */
+    private curPoint: SPoint | null = null;
+
+    /** undo/redo堆栈 */
+    private undoStack: SUndoStack | null = new SUndoStack();
+
     /**
      * 构造函数
      *
@@ -115,14 +125,15 @@ export class SLineItem extends SGraphItem {
      * 添加点至数组中
      *
      * @param   p       添加的点
-     * @param   index   添加到的索引
      * */
     private addPoint(p: SPoint): void {
         if (this.line.length < 2) {
             this.line.push(p);
+            this.recordAction(SGraphPointListInsert, [this.line, p]);
         } else {
             this.line[1] = p;
-            this.status = SRelationState.Normal;
+            this.recordAction(SGraphPointListInsert, [this.line, p, 1]);
+            this.status = SItemStatus.Normal;
         }
         this._xyzListToSPointList(this.line);
         this.update();
@@ -135,12 +146,15 @@ export class SLineItem extends SGraphItem {
      * @return	boolean
      */
     onDoubleClick(event: SMouseEvent): boolean {
+        // 判断是否点击到线上
         if (this.contains(event.x, event.y)) {
-            // 判断是否点击到线上
-            if (this.status == SRelationState.Normal) {
-                this.status = SRelationState.Edit;
-            } else if ((this.status = SRelationState.Edit)) {
-                this.status = SRelationState.Normal;
+            if (this.status == SItemStatus.Normal) {
+                if (this.scene) {
+                    this.scene.grabItem = this;
+                }
+                this.status = SItemStatus.Edit;
+            } else if (this.status == SItemStatus.Edit) {
+                this.status = SItemStatus.Normal;
             }
             this.update();
         }
@@ -154,17 +168,20 @@ export class SLineItem extends SGraphItem {
      * @return  是否处理事件
      * */
     onMouseDown(event: SMouseEvent): boolean {
-        if (this.status == SRelationState.Normal) {
-            return super.onMouseDown(event);
-        } else if (this.status == SRelationState.Edit) {
-            // 判断是否点击到端点上(获取端点索引值)
-            this.findNearestPoint(new SPoint(event.x, event.y));
-        } else if (this.status == SRelationState.Create) {
-            this.addPoint(new SPoint(event.x, event.y));
-            return true;
+        this.curIndex = -1;
+        this.curPoint = null;
+        if (event.buttons == SMouseButton.LeftButton) {
+            if (this.status == SItemStatus.Normal) {
+                return super.onMouseDown(event);
+            } else if (this.status == SItemStatus.Edit) {
+                // 判断是否点击到端点上(获取端点索引值)
+                this.findNearestPoint(new SPoint(event.x, event.y));
+            } else if (this.status == SItemStatus.Create) {
+                this.addPoint(new SPoint(event.x, event.y));
+                return true;
+            }
         }
-        this.$emit("mousedown");
-        return true;
+        return super.onMouseDown(event);
     } // Function onMouseDown()
 
     /**
@@ -174,9 +191,22 @@ export class SLineItem extends SGraphItem {
      * @return	boolean
      */
     onMouseUp(event: SMouseEvent): boolean {
-        if (this._status == SRelationState.Edit) {
-            this.curIndex = -1;
+        if (this.status == SItemStatus.Edit) {
+            if (this.curIndex > -1) {
+                const p = new SPoint(
+                    this.line[this.curIndex].x,
+                    this.line[this.curIndex].y
+                );
+                this.recordAction(SGraphPointListUpdate, [
+                    this.line,
+                    this.curPoint,
+                    p,
+                    this.curIndex
+                ]);
+            }
         }
+        this.curIndex = -1;
+        this.curPoint = null;
         return true;
     } // Function onMouseUp()
 
@@ -187,11 +217,11 @@ export class SLineItem extends SGraphItem {
      * @return  是否处理事件
      * */
     onMouseMove(event: SMouseEvent): boolean {
-        if (this.status == SRelationState.Create) {
+        if (this.status == SItemStatus.Create) {
             if (this.line[0] instanceof SPoint) {
                 this.line[1] = new SPoint(event.x, event.y);
             }
-        } else if (this.status == SRelationState.Edit) {
+        } else if (this.status == SItemStatus.Edit) {
             if (-1 != this.curIndex) {
                 this.line[this.curIndex].x = event.x;
                 this.line[this.curIndex].y = event.y;
@@ -221,6 +251,10 @@ export class SLineItem extends SGraphItem {
             if (dis < len) {
                 len = dis;
                 this.curIndex = i;
+                this.curPoint = new SPoint(
+                    this.line[this.curIndex].x,
+                    this.line[this.curIndex].y
+                );
             }
         }
     } // Function findNearestPoint()
@@ -256,6 +290,20 @@ export class SLineItem extends SGraphItem {
     }
 
     /**
+     * 记录相关动作并推入栈中
+     *
+     * @param	SGraphCommand   相关命令类
+     * @param	any             对应传入参数
+     */
+    protected recordAction(SGraphCommand: any, any: any[]): void {
+        // 记录相关命令并推入堆栈中
+        const command = new SGraphCommand(this, ...any);
+        if (this.undoStack) {
+            this.undoStack.push(command);
+        }
+    } // Function recordAction()
+
+    /**
      * 判断点是否在区域内
      *
      * @param   x
@@ -276,15 +324,39 @@ export class SLineItem extends SGraphItem {
     } // Function contains()
 
     /**
+     * 撤销操作
+     *
+     */
+    undo(): void {
+        if (this.status != SItemStatus.Normal) {
+            if (this.undoStack) {
+                this.undoStack.undo();
+            }
+        }
+    } // Function undo()
+
+    /**
+     * 重做操作
+     *
+     */
+    redo(): void {
+        if (this.status != SItemStatus.Normal) {
+            if (this.undoStack) {
+                this.undoStack.redo();
+            }
+        }
+    } // Function redo()
+
+    /**
      * 取消操作item事件
      *
      * */
     cancelOperate(): void {
-        if (this.status == SRelationState.Create) {
+        if (this.status == SItemStatus.Create) {
             this.parent = null;
             this.releaseItem();
-        } else if (this.status == SRelationState.Edit) {
-            this.status = SRelationState.Normal;
+        } else if (this.status == SItemStatus.Edit) {
+            this.status = SItemStatus.Normal;
             this.releaseItem();
         }
     } // Function cancelOperate()
@@ -323,8 +395,8 @@ export class SLineItem extends SGraphItem {
             painter.drawLine(this.line[0], this.line[1]);
 
             if (
-                this.status == SRelationState.Edit ||
-                this.status == SRelationState.Create
+                this.status == SItemStatus.Edit ||
+                this.status == SItemStatus.Create
             ) {
                 // 绘制端点
                 painter.brush.color = new SColor(this.fillColor);
@@ -341,8 +413,8 @@ export class SLineItem extends SGraphItem {
             }
         } else if (this.line.length == 1) {
             if (
-                this.status == SRelationState.Edit ||
-                this.status == SRelationState.Create
+                this.status == SItemStatus.Edit ||
+                this.status == SItemStatus.Create
             ) {
                 // 绘制端点
                 painter.brush.color = new SColor(this.fillColor);