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

src/component/Canvas/CanvasEditor/components/LayersPanel/LayersPanel.vue

@@ -665,7 +665,19 @@ function buildContextMenuItems(layer) {
         hideContextMenu();
       },
     },
-
+    // 栅格化图层
+    {
+      label: "导出图层",
+      icon: "CExport",
+      disabled:
+        layer.isBackground ||
+        layer.isFixed ||
+        !layerManager?.canRasterizeLayer?.(layer.id),
+      action: () => {
+        exportLayerToImage(layer.id);
+        hideContextMenu();
+      },
+    },
     { type: "divider" },
     // 分组操作 - 带子菜单
     {
@@ -1107,6 +1119,25 @@ async function rasterizeLayer(layerId) {
   }
 }
 
+// 导出图层
+async function exportLayerToImage(layerId) {
+  if (!layerManager?.rasterizeLayer) {
+    console.warn("导出图层功能不可用");
+    return;
+  }
+
+  try {
+    const success = await layerManager.exportLayerToImage(layerId);
+    if (success) {
+      console.log(`✅ 成功导出图层: ${layerId}`);
+    } else {
+      console.warn("导出图层失败");
+    }
+  } catch (error) {
+    console.error("导出图层时发生错误:", error);
+  }
+}
+
 // 合并组图层
 async function mergeGroupLayer(groupId) {
   if (!layerManager?.mergeGroupLayers) {

src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue

@@ -2,6 +2,19 @@
 import { ref, inject, computed, onMounted, onUnmounted } from "vue";
 import { OperationType } from "../utils/layerHelper";
 
+const emit = defineEmits([
+  "tool-selected",
+  "trigger-image-upload",
+  "add-text",
+  "undo",
+  "redo",
+  "toggle-minimap",
+  "zoom-in",
+  "zoom-out",
+  "toggle-red-green-mode",
+  "undo-redo-status-changed",
+]);
+
 const props = defineProps({
   activeTool: String,
   minimapEnabled: {
@@ -24,24 +37,18 @@ const canRedo = ref(false);
 commandManager.setChangeCallback((info) => {
   canUndo.value = info.canUndo;
   canRedo.value = info.canRedo;
+
+  emit("undo-redo-status-changed", {
+    canUndo: canUndo.value,
+    canRedo: canRedo.value,
+    commandManager,
+  });
 });
 
 // 撤销/重做操作
 const undoFun = () => commandManager.undo();
 const redoFun = () => commandManager.redo();
 
-const emit = defineEmits([
-  "tool-selected",
-  "trigger-image-upload",
-  "add-text",
-  "undo",
-  "redo",
-  "toggle-minimap",
-  "zoom-in",
-  "zoom-out",
-  "toggle-red-green-mode",
-]);
-
 // 普通模式工具列表
 const normalToolsList = ref([
   {