feat: 裁剪组裁剪跟随选择组移动

src/component/Canvas/CanvasEditor/managers/ThumbnailManager.js

@@ -11,7 +11,8 @@ export class ThumbnailManager {
     this.layers = options.layers || []; // 图层管理器
     this.layerThumbSize = options.layerThumbSize || { width: 48, height: 48 };
 
-    this.layerThumbnails = new Map(); // 图层缩略图缓存
+    // this.layerThumbnails = new Map(); // 图层缩略图缓存   -   改成使用图层对象的thumbnailUrl属性
+    // 使用图层对象的thumbnailUrl属性来存储缩略图URL
     this.defaultThumbnail =
       "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII="; // 1x1 透明图
   }
@@ -23,17 +24,24 @@ export class ThumbnailManager {
   async generateLayerThumbnail(layerId) {
     const fabricObjects = this._collectLayersAndObjects(layerId);
 
+    if (!fabricObjects || fabricObjects.length === 0) {
+      console.warn("⚠️ 无法生成缩略图：没有可栅格化的对象  返回空缩略图");
+      // 如果没有对象，返回默认缩略图
+      const { layer } = findLayerRecursively(this.layers.value, layerId);
+      if (layer) {
+        layer.thumbnailUrl = this.defaultThumbnail; // 更新图层对象的缩略图
+      }
+      return this.defaultThumbnail;
+    }
+
     // 延迟执行，避免阻塞UI
     fabricObjects.length > 0 &&
       requestIdleCallback(() => {
         setTimeout(async () => {
           const base64 = await this._generateLayerThumbnailNow(fabricObjects);
-          this.layerThumbnails.set(layerId, base64);
+          // this.layerThumbnails.set(layerId, base64);
           try {
-            const { layer, parent } = findLayerRecursively(
-              this.layers.value,
-              layerId
-            );
+            const { layer, parent } = findLayerRecursively(this.layers.value, layerId);
             if (layer) {
               layer.thumbnailUrl = base64; // 更新图层对象的缩略图
             }
@@ -201,7 +209,7 @@ export class ThumbnailManager {
    */
   getLayerThumbnail(layerId) {
     if (!layerId) return null;
-    return this.layerThumbnails.get(layerId) || null;
+    // return this.layerThumbnails.get(layerId) || null;
   }
 
   /**
@@ -210,7 +218,7 @@ export class ThumbnailManager {
    */
   clearLayerThumbnail(layerId) {
     if (layerId && this.layerThumbnails.has(layerId)) {
-      this.layerThumbnails.delete(layerId);
+      // this.layerThumbnails.delete(layerId);
     }
   }
 
@@ -218,7 +226,7 @@ export class ThumbnailManager {
    * 清除所有缩略图
    */
   clearAllThumbnails() {
-    this.layerThumbnails.clear();
+    // this.layerThumbnails.clear();
   }
 
   /**