feat: 实时更新背景色+选取剪切+选取删除初步开发完成

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

@@ -43,6 +43,7 @@ const emit = defineEmits([
 // 笔刷面板相关状态
 const showBrushPanel = ref(false);
 const brushPanelRef = ref(null);
+const lastColor = ref("#ffffff");
 
 // 计算属性
 // const shouldShowBrushSettings = computed(() => {
@@ -82,17 +83,32 @@ function updateCanvasSize(
 }
 
 function updateCanvasColor() {
+  console.log("更新画布颜色:", props.canvasColor);
   if (!layerManager) {
     console.warn("LayerManager 未初始化，无法更改背景色");
     return;
   }
 
   // 更新背景层颜色而不是画布颜色
-  layerManager.updateBackgroundColor(props.canvasColor);
-
+  layerManager.updateBackgroundColor(props.canvasColor, {
+    oldColor: lastColor.value,
+    undoable: true,
+  });
+  lastColor.value = props.canvasColor;
   emit("canvas-color-change");
 }
 
+watch(
+  () => props.canvasColor,
+  (newColor) => {
+    // 更新背景层颜色而不是画布颜色
+    layerManager.updateBackgroundColor(newColor, {
+      oldColor: lastColor.value,
+      undoable: false, // 不需要撤销
+    });
+  }
+);
+
 // 切换笔刷面板显示状态
 function toggleBrushPanel() {
   // 如果笔刷没有激活  则激活笔刷工具
@@ -222,6 +238,7 @@ function showLayerPanel() {
 }
 
 onMounted(() => {
+  lastColor.value = props.canvasColor;
   // 获取工具管理器和笔刷管理器
   const brushManager = toolManager?.brushManager;