深度画布键盘事件-撤回功能

src/components/Canvas/DepthCanvas/manager/CanvasManager.ts

@@ -59,6 +59,18 @@ export class CanvasManager {
 		const canvasY = this.canvasViewHeight / 2 - this.canvasHeight / 2
 		this.canvas.viewportTransform = [1, 0, 0, 1, canvasX, canvasY]
 
+		// 动画管理器
+		this.animationManager = new AnimationManager(this.canvas, {
+			currentZoom: this.currentZoom,
+			canvasManager: this,
+			wheelThrottleTime: 15, // 降低滚轮事件节流时间，提高响应性
+			defaultEase: "power2.lin",
+			defaultDuration: 0.3, // 缩短默认动画时间
+		});
+		this.setupCanvasEvents()
+		this.setupBrushEvents()
+
+		this.stateManager.toolManager.setTool(OperationType.SELECT)
 		// 创建矩形
 		const rect = this.layerManager.createRectLayer({
 			left: 400,
@@ -71,21 +83,9 @@ export class CanvasManager {
 		})
 		// 文字
 		const text = this.layerManager.createTextLayer('Hello World');
-
-		this.animationManager = new AnimationManager(this.canvas, {
-			currentZoom: this.currentZoom,
-			canvasManager: this,
-			wheelThrottleTime: 15, // 降低滚轮事件节流时间，提高响应性
-			defaultEase: "power2.lin",
-			defaultDuration: 0.3, // 缩短默认动画时间
-		});
-		this.setupCanvasEvents()
-		this.stateManager.toolManager.setTool(OperationType.SELECT)
 		this.layerManager.updateLayers()
 		this.layerManager.setActiveID(text.info.id)
-
-
-		this.setupBrushEvents()
+		this.stateManager.recordState()
 	}
 	/** 画布添加对象 */
 	add(obj: any, isUpdate = true) {
@@ -104,6 +104,7 @@ export class CanvasManager {
 			animationManager: this.animationManager,
 			toolManager: this.stateManager.toolManager,
 			layerManager: this.stateManager.layerManager,
+			stateManager: this.stateManager,
 		});
 		// 设置动画交互效果
 		this.animationManager.setupInteractionAnimations();
@@ -176,7 +177,6 @@ export class CanvasManager {
 	getCanvasJSON() {
 		const keys = ["top", "left", "width", "height", "scaleX", "scaleY", "info",]
 		const json = this.canvas.toJSON(keys)
-		console.log(json, this.getObjects())
 		return JSON.stringify(json)
 	}
 	/** 加载画布JSON */
@@ -195,4 +195,8 @@ export class CanvasManager {
 		})
 
 	}
+	dispose() {
+		this.animationManager?.dispose()
+		this.eventManager?.dispose()
+	}
 }