fix: 优化细节

src/component/Canvas/CanvasEditor/commands/FillLayerBackgroundCommand.js

@@ -52,7 +52,10 @@ export class FillLayerBackgroundCommand extends Command {
     let clippingMaskFabricObject = null;
     if (layer.clippingMask) {
       // 反序列化 clippingMask
-      clippingMaskFabricObject = await restoreFabricObject(layer.clippingMask, this.canvas);
+      clippingMaskFabricObject = await restoreFabricObject(
+        layer.clippingMask,
+        this.canvas
+      );
       clippingMaskFabricObject.clipPath = null;
 
       clippingMaskFabricObject.set({
@@ -75,7 +78,6 @@ export class FillLayerBackgroundCommand extends Command {
         originY: clippingMaskFabricObject.originY || "center",
         scaleX: clippingMaskFabricObject.scaleX || 1,
         scaleY: clippingMaskFabricObject.scaleY || 1,
-        type: "fill",
       });
 
       this.newFill.clipPath = clippingMaskFabricObject; // 设置填充的遮罩
@@ -96,7 +98,6 @@ export class FillLayerBackgroundCommand extends Command {
           evented: false,
           originX: "center",
           originY: "center",
-          type: "fill",
         });
       }
     }
@@ -104,11 +105,15 @@ export class FillLayerBackgroundCommand extends Command {
     // 判断fabricObjects是否是组，是组则添加填充到最前面，否则创建组
     if (layer.fabricObjects && layer.fabricObjects.length > 0) {
       let insertIndex =
-        this.canvas.getObjects()?.findIndex((obj) => obj.id === layer.fabricObjects?.[0]?.id) || 0;
+        this.canvas
+          .getObjects()
+          ?.findIndex((obj) => obj.id === layer.fabricObjects?.[0]?.id) || 0;
       if (this.oldFill) {
         // 如果有旧填充，先获取旧的索引再移除旧填充
         insertIndex =
-          this.canvas.getObjects()?.findIndex((obj) => obj.id === this.oldFill?.id) || 0;
+          this.canvas
+            .getObjects()
+            ?.findIndex((obj) => obj.id === this.oldFill?.id) || 0;
         removeCanvasObjectByObject(this.canvas, this.oldFill);
       }
       insertIndex = insertIndex == -1 ? 0 : insertIndex;
@@ -122,13 +127,17 @@ export class FillLayerBackgroundCommand extends Command {
           .getObjects()
           .findIndex(
             (obj) =>
-              obj.id === this.originalfabricObjects[this.originalfabricObjects.length - 1]?.id
+              obj.id ===
+              this.originalfabricObjects[this.originalfabricObjects.length - 1]
+                ?.id
           ) || 0;
 
       if (this.oldFill) {
         // 如果有旧填充，先获取旧的索引再移除旧填充
         insertIndex =
-          this.canvas.getObjects()?.findIndex((obj) => obj.id === this.oldFill?.id) || 0;
+          this.canvas
+            .getObjects()
+            ?.findIndex((obj) => obj.id === this.oldFill?.id) || 0;
         removeCanvasObjectByObject(this.canvas, this.oldFill);
       }
       insertIndex = insertIndex == -1 ? 0 : insertIndex;
@@ -142,7 +151,9 @@ export class FillLayerBackgroundCommand extends Command {
     if (!this.isRetimeUpdate) {
       layer.fill = this.newFill.toObject(["id", "layerId"]);
       layer.fillColor = this.fillColor;
-      this.canvasManager.thumbnailManager?.generateLayerThumbnail(this.layer.id);
+      this.canvasManager.thumbnailManager?.generateLayerThumbnail(
+        this.layer.id
+      );
 
       // 重新排序
       // 使用LayerSort工具重新排列画布对象（如果可用）
@@ -187,7 +198,10 @@ export class FillLayerBackgroundCommand extends Command {
         .map((obj) => {
           return findObjectById(this.canvas.value, obj.id)?.object || obj;
         });
-    } else if (this.layer.fabricObjects && this.layer.fabricObjects.length > 0) {
+    } else if (
+      this.layer.fabricObjects &&
+      this.layer.fabricObjects.length > 0
+    ) {
       // 如果是普通图层，直接返回其fabric对象
       return this.layer.fabricObjects.map((obj) => {
         return findObjectById(this.canvas.value, obj.id)?.object || obj;
@@ -204,11 +218,17 @@ export class FillLayerBackgroundCommand extends Command {
       minTop = Infinity,
       maxRight = -Infinity,
       maxBottom = -Infinity;
-    console.log("计算当前所有对象的边界信息:===>", this.originalfabricObjects.length);
+    console.log(
+      "计算当前所有对象的边界信息:===>",
+      this.originalfabricObjects.length
+    );
     this.originalfabricObjects?.forEach((obj) => {
       const { object } = findObjectById(this.canvas, obj.id) || {};
       if (object) {
-        const rect = object.getBoundingRect({ absolute: true, includeStroke: false });
+        const rect = object.getBoundingRect({
+          absolute: true,
+          includeStroke: false,
+        });
         minLeft = Math.min(minLeft, rect.left);
         minTop = Math.min(minTop, rect.top);
         maxRight = Math.max(maxRight, rect.left + rect.width);