深度画布细节调整

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

@@ -101,12 +101,15 @@ export class AISelectboxToolManager {
 	}
 	createIndicatorObject() {
 		this.clearIndicatorObject()
+		var color = 'rgba(0, 255, 0, 0.5)'
+		if (this.toolManager.currentTool.value === OperationType.AISELECT_REMOVE) {
+			color = 'rgba(255, 0, 0, 0.5)'
+		}
 		const rect = new fabric.Rect({
 			left: this.startX,
-			top: this.startY,
 			width: 0,
 			height: 0,
-			fill: 'transparent',
+			fill: color,
 			stroke: '#000',
 			strokeWidth: 1,
 			evented: false,

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

@@ -101,8 +101,6 @@ export class CanvasManager {
 			})
 		}
 		this.canvas = createCanvas(options.canvasRef.value, {
-			preserveObjectStacking: true,
-			enableRetinaScaling: true,
 			backgroundColor: '#fff',
 		})
 		if (image) {

src/components/Canvas/DepthCanvas/tools/canvasFactory.js

@@ -6,8 +6,9 @@ import { fabric } from "fabric-with-all";
 export const createCanvas = (elementId, options = {}) => {
 	// Create the canvas instance
 	const canvas = new fabric.Canvas(elementId, {
-		enableRetinaScaling: true,
-		renderOnAddRemove: false,
+		controlsAboveOverlay: true,// 控制面板在图层之上
+		enableRetinaScaling: true,// 启用Retina缩放
+		renderOnAddRemove: false,// 不在添加或移除对象时重新渲染
 		preserveObjectStacking: true, // 保持对象堆叠顺序
 		// skipOffscreen: true, // 跳过离屏渲染
 		imageSmoothingEnabled: true, // 启用图像平滑 - 抗锯齿
@@ -26,7 +27,7 @@ export const createCanvas = (elementId, options = {}) => {
  */
 export const createStaticCanvas = (elementId, options = {}) => {
 	const canvas = new fabric.StaticCanvas(elementId, {
-		enableRetinaScaling: true,
+		enableRetinaScaling: true,// 启用Retina缩放
 		imageSmoothingEnabled: true, // 启用图像平滑 - 抗锯齿
 		imageSmoothingQuality: "high", // 设置高质量图像平滑
 		skipOffscreen: false, // 不跳过离屏渲染