feat: 1.固定图层缩略图（完成）

2.工具栏新增插槽（完成）
3.loadJSON的元素顺序回发生错误

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

@@ -348,14 +348,18 @@ export class CanvasManager {
     }
   }
 
-  setCanvasSize(width, height) {
+  async setCanvasSize(width, height) {
     this.width = width;
     this.height = height;
     this.canvas.setWidth(width);
     this.canvas.setHeight(height);
 
     // 重置视图变换以确保元素位置正确
-    this._resetViewportTransform();
+    // this._resetViewportTransform();
+    if (this.canvas.getZoom() !== 1 || this.canvas.viewportTransform[0] !== 1) {
+      this.canvas.setViewportTransform([1, 0, 0, 1, 0, 0]);
+      await this.resetZoom();
+    }
 
     // 居中所有画布元素，包括背景层和其他元素
     this.centerAllObjects();
@@ -964,7 +968,6 @@ export class CanvasManager {
                 this.layers.value,
                 this.canvas.getObjects()
               );
-
               // 验证图层关联关系  -  稳定后可以注释
               const isValidate = validateLayerAssociations(
                 this.layers.value,
@@ -972,6 +975,9 @@ export class CanvasManager {
               );
 
               console.log("图层关联验证结果:", isValidate);
+              // 排序
+              // 使用LayerSort工具重新排列画布对象（如果可用）
+              await this?.layerManager?.layerSort?.rearrangeObjects();
 
               this.layerManager.activeLayerId.value =
                 this.layers.value[0]?.id || parsedJson?.activeLayerId || null;

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

@@ -1,6 +1,6 @@
 import { fabric } from "fabric-with-all";
 import { findObjectById } from "../utils/helper";
-import { createRasterizedImage } from "../utils/SelectionToImage";
+import { createRasterizedImage } from "../utils/selectionToImage";
 
 /**
  * 图片导出管理器

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

@@ -1390,136 +1390,6 @@ export class LayerManager {
     };
   }
 
-  /**
-   * 导入图层数据
-   * @param {Object} data 图层数据对象
-   * @returns {boolean} 是否导入成功
-   */
-  importLayersData(data) {
-    if (!data || !data.layers || !Array.isArray(data.layers)) {
-      console.error("无效的图层数据");
-      return false;
-    }
-
-    const fabric = window.fabric;
-    if (!fabric) {
-      console.error("未找到fabric库");
-      return false;
-    }
-
-    // 清除画布
-    this.canvas.clear();
-
-    // 清空图层列表
-    this.layers.value = [];
-
-    // 设置画布尺寸
-    if (data.canvasWidth && data.canvasHeight) {
-      this.canvasWidth = data.canvasWidth;
-      this.canvasHeight = data.canvasHeight;
-      this.canvas.setWidth(data.canvasWidth);
-      this.canvas.setHeight(data.canvasHeight);
-    }
-
-    // 设置背景颜色
-    if (data.backgroundColor) {
-      this.backgroundColor = data.backgroundColor;
-    }
-
-    // 设置编辑模式
-    if (data.editorMode) {
-      this.editorMode = data.editorMode;
-    }
-
-    // 导入图层
-    const promises = data.layers.map((layerData) => {
-      return new Promise((resolve) => {
-        const newLayer = {
-          ...layerData,
-          fabricObjects: [],
-          children: layerData.children || [],
-        };
-
-        // 如果有序列化的对象，恢复它们
-        if (
-          layerData.serializedObjects &&
-          Array.isArray(layerData.serializedObjects)
-        ) {
-          fabric.util.enlivenObjects(layerData.serializedObjects, (objects) => {
-            objects.forEach((obj) => {
-              // 关联到图层
-              obj.layerId = newLayer.id;
-              obj.layerName = newLayer.name;
-
-              // 添加到画布
-              this.canvas.add(obj);
-
-              // 添加到图层
-              newLayer.fabricObjects.push(obj);
-            });
-
-            resolve(newLayer);
-          });
-        } else if (
-          layerData.isBackground &&
-          layerData.serializedBackgroundObject
-        ) {
-          // 恢复背景对象
-          fabric.util.enlivenObjects(
-            [layerData.serializedBackgroundObject],
-            ([bgObject]) => {
-              if (bgObject) {
-                bgObject.layerId = newLayer.id;
-                bgObject.layerName = newLayer.name;
-                this.canvas.add(bgObject);
-                newLayer.fabricObject = bgObject;
-              }
-
-              resolve(newLayer);
-            }
-          );
-        } else {
-          resolve(newLayer);
-        }
-      });
-    });
-
-    // 等待所有图层加载完成
-    Promise.all(promises).then((layers) => {
-      // 更新图层列表
-      this.layers.value = layers;
-
-      // 设置活动图层
-      if (data.activeLayerId) {
-        const activeLayer = layers.find(
-          (layer) => layer.id === data.activeLayerId
-        );
-        if (activeLayer && !activeLayer.isBackground && !activeLayer.locked) {
-          this.activeLayerId.value = data.activeLayerId;
-        } else {
-          // 查找第一个非背景、非锁定的图层
-          const firstNormalLayer = layers.find(
-            (layer) => !layer.isBackground && !layer.locked
-          );
-          if (firstNormalLayer) {
-            this.activeLayerId.value = firstNormalLayer.id;
-          }
-        }
-      }
-
-      // 确保至少有一个背景图层和一个普通图层
-      this.initializeLayers();
-
-      // 更新对象交互性
-      this.updateLayersObjectsInteractivity();
-
-      // 重新排列对象
-      this._rearrangeObjects();
-    });
-
-    return true;
-  }
-
   /**
    * 复制图层数据到剪贴板
    * @param {string} layerId 要复制的图层ID