feat: 添加导出图层功能，支持将图层转换为位图图像并下载

src/component/Canvas/CanvasEditor/index.vue

@@ -40,7 +40,7 @@ const KeyboardShortcutHelp = defineAsyncComponent(() =>
   import("./components/KeyboardShortcutHelp.vue")
 );
 
-const emit = defineEmits(["trigger-red-green-mouseup"]);
+const emit = defineEmits(["trigger-red-green-mouseup", "changeCanvas"]);
 
 const props = defineProps({
   canvasJSON: {
@@ -296,6 +296,7 @@ onMounted(async () => {
       layerManager,
       toolManager,
       commandManager,
+      clothingImageOpts: props.clothingImageOpts,
     });
 
     canvasManager.setRedGreenModeManager(redGreenModeManager);
@@ -628,6 +629,15 @@ function handleChildLayersReorder(reorderData) {
   }
 }
 
+// 处理画布变更事件
+const changeCanvas = (command) => {
+  const commandData = {
+    isChange: command.canUndo || command.canRedo, // 是否有可撤销或可重做的操作
+    ...command, // 传递完整的命令数据
+  };
+  emit("changeCanvas", commandData);
+};
+
 // 提供外部ref实例方法
 defineExpose({
   getCanvasManager: () => canvasManager, // 获取画布管理器实例
@@ -653,6 +663,7 @@ defineExpose({
   //图片url或者base64
   addImageToLayer: async (url) => {
     if (!url) return Promise.reject(new Error("图片URL不能为空"));
+
     return await loadImageUrlToLayer({
       imageUrl: url,
       layerManager,
@@ -660,10 +671,6 @@ defineExpose({
       toolManager,
     });
   },
-  //图片url或者base64数组   可选图层ID   不传默认新建图层
-  addMultipleImagesToLayer: (urls, layerId) => {
-    return canvasManager?.addMultipleImages(urls, layerId);
-  },
   // 导出图片
   exportImage: ({
     isContainBg = false, // 是否包含背景图层
@@ -806,6 +813,7 @@ defineExpose({
           @add-text="handleAddText"
           @zoom-in="zoomIn"
           @zoom-out="zoomOut"
+          @undo-redo-status-changed="changeCanvas"
         />
       </div>